JS基本语法

89 阅读4分钟

1.表达式和语句

1.表达式

  • 1 + 2表达式的值为3
  • add(1,2)表达式的值为函数的返回值(只有函数有返回值)
  • console.log表达式的值为函数本身

2.语句

var a=1是一个语句

3.表达式和语句的区别

  • 表达式一般都有值,语句可能有也可能没有
  • 语句一般会改变环境(声明、赋值)
  • 上面两句话并不是绝对的,存在各种特殊情况

4.JS是大小写敏感的

  • var a和var A是不同的,
  • object和Object是不同的
  • function 和 Function 是不同的

5.分隔符

  • var a = 1和 var a=1 没有区别,只要不影响计算机的断句理解,多少个空格都没有区别
  • 回车类似,绝大多数情况没有影像,但是return 后不可以加回车

2.标识符

1.规则

  • 第一个字符,可以是Unicode字母或$或_或中文
  • 后面的字其余符,除了上面所说的几类字符还可以有数字
var _ = 1
var $  =  2
var __ =  6
var 你好 = 'h'
  • 减少使用会造成歧义的拼音和简写
  • 不要使用无法区分的命名方式,例如连续多个下划线

2.注释

  • 有两种写法 //注释为单行的注释 /*注释*/为跨行注释
  • 不好的注释:直译代码内容为中文,过时的内容,纯发泄的内容
  • 优秀的注释:踩坑经验,遇到bug的代码奇怪写法的原因和解释

3.区块block

把代码包在一起


{

  let a = 1let b = 2

}


常常与if/for/while合用

3.if语句

语法

  • if (表达式) {语句1} else {语句2}
  • {}在语句只有一句的时候可以省略,不建议这样做

变态情况

  • 表达式里可以非常变态,如a = 1 (注意这个是赋值语句)
  • 语句1里可以非常变态,如嵌套的if else

  • 语句2里可以非常变态,如嵌套的if else

  • 缩进也可以很变态,如面试题常常下套

a = 1
if(a === 2)
  console.log('a')

  console.log('a等于2')

最终打出的是“a等于2”,if语句在不加括号的前提下智能控制下面一句,缩进只有迷惑作用

戒律:使用最没有歧义的写法

最推荐的写法:

if (表达式){

  语句

} else if (表达式){

  语句

} else {
  语句

}

次推荐的写法(函数中):

function fn(){
  
if (表达式){

    return 表达式

  }

  if (表达式){

   return 表达式
  } 
  
return 表达式

}

4.switch语句


语法

switch (fruit) {
  case "banana":

  // ...break;
  case "apple":

  // ...break;

  default:

  // ...

}

  • 大部分时候,省略break会造成非常严重的问题,
  • 少部分时候,可以利用break,不推荐使用(利用多个case公用的break这类特殊情况)

5.其他条件语句

三元表达式

if只有一个语句,else也只有一个语句的时候非常好用 表达式1?表达式2:表达式3

function max(a, b) {
  if (a > b) return a;
  else return b;
}

等同于

function max(a, b) {
   return a>b ? a:b
}

&&短路逻辑

A&&B&&C&&D 取第一个假值或者D
 并不会取true/false

||短路逻辑

A||B||C||D取第一个真值或D,并不会取true/false

a = a || 5; //如果a存在就等于a,否则等于5

6.while

while (表达式){语句}

  • 判断表达式的真假

  • 当表达式为真,执行语句
  • 执行完再判断表达式的真假

  • 当表达式为假,执行后面的语句


注意死循环 举例:

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

也是死循环,因为IEEE754的浮点数表达方式问题,浮点数相加所得的1并不是准确的1

7.for循环

for是while循环的方便写法,是一种语法糖

语法

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

  • 先执行语句1

  • 然后判断表达式2

  • 如果为真,执行循环体,然后执行语句3

  • 如果为假,直接退出循环,执行后面的语句

break 和 continue


退出所有循环 和 退出当前一次循环

for (var i = 0; i < 10; i++) {
  for (var j = 100; j < 110; j++) {
    if (i === 5) {
      break;
    }
  }
  console.log(i);
}

break只打断最近的一层循环,因此上述的i循环并没有被打断

1.png

注意循环内的输出时机问题,例如循环体内部的setTimeout的输出都是最后的值

8.label
语法

foo: {

  console.log(1);
  
break foo;

  console.log('本行不会输出1');

}

console.log(2);


面试可能会问到

{
foo: 1
}不是对象,是标签,内容是1,但是Chrome浏览器有奇怪的优化,可以在火狐浏览器上进行实现