JS基本语法

作者: cy_Wey | 来源:发表于2022-07-03 00:53 被阅读0次

一、表达式和语句

  • 表达式一般有值,语句可以有值也可能没有值
  • 语句一般会改变环境(声明,赋值)

二、标识符

  1. Unicode 字符
  2. $
  3. 下划线 _ , 最多使用两个下划线
  4. 数字,但是不能作为开头
  5. 中文

用拼音做标识符不如用中文

三、注释

  1. // 单行注释
  2. /* 多行注释 */

不好的注释

  • 把代码翻译成中文
  • 过时的注释
  • 发泄不满的注释

好的注释

  • 踩坑注释
  • 遇到的 bug,怎么解决的
  • 说明为什么代码写得这么奇怪

四、if 语句

1. 语法

if ( 表达式 ) {
    语句 1
} else {
    语句 2
}

2. 注意事项

  • 只有一句语句时花括号 { } 可以省略
  • 语句 1 和 语句 2 里面可以嵌套 if else
  • “=” 表示赋值,“ === ” 表示相等
  • 逗号表示语句没有完成,分号表示语句完成了
  • 永远都要使用最没有歧义的写法
if ( 表达式 1 ) {
  语句 1
} else if ( 表达式 2 ) {
  语句 2
} else {  
  语句 3
}

3. 三元表达式

最简单的 if else 写法
例如
a === 3 ? b = a : b = 0 等价于

if ( a=== 3) { 
 b = 3 
} else { 
 b = 0 }

4. && 短路逻辑

window.f1 && console.log( 'f1不存在' ) 等价于

if ( window.f1) {
  console.log( 'f1不存在' )
}

a && b && c && d 取第一个假的值,如果都为真,取最后一个值

5. || 短路逻辑

a = a || 100 等价于

if ( a ) {
   a = a
} else {
  a = 100
}

a || b || c || d 取第一个真值

五、while 语句

1. 语法

while ( 表达式 )  {
 语句
}

执行顺序:先判断表达式真假,如果表达式为真时,执行语句,执行完语句后再次判断表达的真假,如果表达式为假,跳出 while 循环。

2. 注意事项

var a = 0.1 
while (a !== 1) {
a = a + 0.1
}

这个是死循环,因为 浮点数不够精确,10 个 0.1 不等于 1, 而是等于 0.9999999

六、for 语句

1. 语法

for ( 语句 1 ; 表达式 2 ; 语句 3 ) {
  循环体
}

执行顺序:开始的时候会执行一次语句 1,再判断表达式 2,如果表达式 2 成立,执行循环体,执行完循环体后,再执行语句 3 (一般为递增表达式或者递减表达式),再判断表达式2,如果表达式不成立,结果 for 循环

2. 注意事项

for (var i = 0 ; i < 5 ; i++) {
  setTimeout(() => {
  console.log (i)
  }, 0)
}

这个循环会打印 5 次 5,而不是0,1,2,3,4,因为 for 语句执行完后,i 立马会变成 5,并执行了 5 次 setTimeout
如果的打印出 0,1,2,3,4,可将 var 改成 let,或者将 setTimeout 放在 for 的外层

3. break 和 continue

break : 跳出当前的循环,如果有多层循环嵌套,会跳出最近的一层循环
continue : 跳过当前步

七、label 语句

label 是标记语句,任何不属于保留关键字的 JavaScript 标识符。
标记语句可以和 breakcontinue 语句一起使用。标记就是在一条语句前面加个可以引用的标识符(identifier)

语法

label :
   statement

statement JavaScript 语句。break 可用于任何标记语句,而 continue 可用于循环标记语句。

示例

for 循环中使用带标记的 continue 语句

var i, j;

    loop1:
    for (i = 0; i < 3; i++) {      //The first for statement is labeled "loop1"
       loop2:
       for (j = 0; j < 3; j++) {   //The second for statement is labeled "loop2"
          if (i === 1 && j === 1) {
             continue loop1;
          }
          console.log('i = ' + i + ', j = ' + j);
       }
    }

// Output is:
//   "i = 0, j = 0"
//   "i = 0, j = 1"
//   "i = 0, j = 2"
//   "i = 1, j = 0"
//   "i = 2, j = 0"
//   "i = 2, j = 1"
//   "i = 2, j = 2"
// Notice how it skips both "i = 1, j = 1" and "i = 1, j = 2"

在代码块中使用标记,但只有 break 语句可以使用非循环标记

foo: {
  console.log('face');
  break foo;
  console.log('this will not be executed');
}
console.log('swap');

// this will log:

// "face"
// "swap

资料来源:饥人谷,MDN

相关文章

  • JS基本操作

    js编写位置 js基本语法 字面量和变量

  • 10

    js编写位置 !DOCTYPE html> js编写位置 js基本语法 !DOCTYPE html> ...

  • JS补充3

    JS的基本语法 JS语句基本规则 语句后面要用分号结束,特例:function,for, if后面...

  • JS基础和WebAPIs的关联性

    学习ECMAscript标准规定的基本语法掌握JS基础语法只学习JS基础做不了网页交互效果学习JS基础语法是为了后...

  • js基本语法

    1、分类ECMAScript js基本语法与标准DOM Document Object Mode...

  • JS基本语法

    1、分类ECMAScript js基本语法与标准DOM Document Object Model文档对象模型BO...

  • JS基本语法

    编写位置: 可以将js代码编写到外部js文件中,然后通过script标签引入 写到外部文件中可以在不同的页面中同时...

  • 「JS」基本语法

    变量标示符 关键字与保留字 字符敏感 严格模式 注释 变量标示符 变量的命名 关键字与保留字 JavaScript...

  • js基本语法

    之前我们说到一个网页主要由三部分组成: 结构、表现还有行为。 而这三个部分主要体现为三种语言,之前我们学习了: 结...

  • js基本语法

    运算符: JS中我们定义了一套对数据进行运算的运算符。 这其中包括:算数运算符,位运算符,关系运算符。 算术运算符...

网友评论

    本文标题:JS基本语法

    本文链接:https://www.haomeiwen.com/subject/gozkbrtx.html