JS - 初识JavaScript学习小记

JS使用

2022-09-29

标签

<script>

<script>JavaScript的代码</script>

<head>

<head>JavaScript函数</head>

<body>

<body>JavaScript函数</body>

 

外部脚本

脚本放在外部文件(扩展名是.js)里

使用:

<script src="myScript.js"></script>

优势

分离HTML和代码

使HTML和JavaScript易读和维护

已缓存的JavaScript文件 可 加速页面加载

 

外部引用

通过 完整的URL 或 相对于当前页面的路径 引用

 

 

---------------------------------------------------------------------------------------------------------

 

 

JS输出

JavaScript 能够以不同方式“显示”数据:

  • 使用 window.alert() 写入警告框
  • 使用 document.write() 写入 HTML 输出
  • 使用 innerHTML 写入 HTML 元素
  • 使用 console.log() 写入浏览器控制台

 

访问HTML元素

使用document.getElementById(id).innerHTML=5+6;

  id-HTML元素

  innerHTML-HTML内容

 

 

 

使用document.write();

document.write(5+6);

- 仅用于测试

- 会删除所有已有的HTML

 

使用window.alert();

window.alert(5+6);

- 用于弹框警告

 

使用console.log();

console.log(5+6);

- 按F12 在 控制台 显示内容

 

 

---------------------------------------------------------------------------------------------------------

 

 

JS语句 - 一套规则

程序 - 语句 - 代码

由浏览器执行的指令(编程指令)

JavaScript 程序 就是一系列的 编程语句

 

 

构成

值、运算符、表达式、关键词、注释

 

值的类型

混合值(字面量):

  规则

  写数值有无小数点均可

  字符串是文本,使用:“”或‘’

变量值(变量):

  数据值

    数值、文本值(字符串--被 单引号 或者 双引号 包围)

  var声明(创建)变量

    声明后,变量是没有值的(值是undefined)

    重复声明 不会 丢失它的值

  =赋值

  

运算符   

算数运算符 + - * / ==

  +:数字 - 运算

    字符串 - 级联

    对数字和字符串相加,结果将是字符串

      

 

      在第一个例子中,JavaScript 把 911 和 7 视作数值,直到遇见 "Porsche"。

      

 

      在第二个例子中,由于第一个操作数是字符串,因此所有操作数都被视为字符串。

 

赋值运算符 =

 

表达式

组成:值(数值 or 字符串)、变量值、变量、运算符

结果:值

 

关键字

- 用于标识被执行的动作

全局作用域:函数之外声明的变量

局部作用域:代码块里

  变量定义的位置 - 函数内外

 - ES2015

  let:重新声明变量

1 { 
2   let x = 10;
3 }
4 // 此处不可以使用 x
5 //使用 let 关键字重新声明变量可以解决这个问题。在块中重新声明变量不会重新声明块外的变量:
复制代码
1 1 var x = 10;
2 2 // 此处 x 为 10
3 3 { 
4 4   var x = 6;
5 5   // 此处 x 为 6
6 6 }
7 7 // 此处 x 为 6
8 8 // 使用 var 关键字重新声明变量会带来问题。
9 9 // 在块中重新声明变量也将重新声明块外的变量:
复制代码

 

注释

//  单行注释

/**/  多行注释

- 不被执行

- 可用于阻止代码执行

 

 

执行

按照 编写顺序

 

分号;

- 分隔js语句

- 有分号分隔的语句,可将 多行 写作 一行

 

逗号,

一条语句,多个变量(逗号分隔)

 

空白字符

- 会被忽略

- 在运算符旁边添加空格,增强可读性

 

长度、折行

80个字符

 

代码块 - 局部作用域

{代码块}

作用

定义 一起执行的语句

 

关键字

- 是保留的单词

- 保留词无法用作变量名

break:终止switch 或 循环

continue:跳出循环 并 在顶端开始

debugger:停止执行js 并 调试 调试函数(假设可用)

do...while:执行语句块 并 在条件为真时 重复代码块

for:(条件为真时)标记 需被执行的 语句块

function:声明函数

if...else:(根据条件)标记 需被执行的语句块

return:退出函数

switch:(根据不同的情况)标记 需被执行的语句跨

try...catch:对语句块实现错误处理

var:声明变量

 

 

书写

标识符(名称)

用于

命名变量、关键字、函数、标签

规则

  • 名称可包含字母、数字、下划线和美元符号
  • 名称必须以字母开头
  • 名称也可以 $ 和 _ 开头(但是在本教程中我们不会这么做)
  • 名称对大小写敏感(y 和 Y 是不同的变量)
  • 保留字(比如 JavaScript 的关键词)无法用作变量名称

  提示:

  数值不可以作为首字符

  区分标识符和数值

 

对大小写敏感 - 书写要规范

两个不同的变量

 

不能使用连字符(它是为减法预留的)

下划线

驼峰式大小写(经常使用以小写字母开头的驼峰大小写)

字符集Unicode 覆盖世界上几乎所有的字符、标点和符号

 

posted @   yzhone  阅读(25)  评论(1编辑  收藏  举报
相关博文:
阅读排行:
· 【.NET】调用本地 Deepseek 模型
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· 我与微信审核的“相爱相杀”看个人小程序副业
· DeepSeek “源神”启动!「GitHub 热点速览」
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
点击右上角即可分享
微信分享提示