JS 基本语法

144 阅读3分钟

提要:

  1. 表达式、语句
  2. 标识符的规则
  3. 条件语句(if else语句,switch语句,问好冒号表达式,&& 逻辑,|| 逻辑)
  4. 循环语句(while循环,for循环,break和continue语句)
  5. label语句

一. 表达式、语句

1. 表达式

一般有值

表达式表达式的值
1+23
add(1,2)函数的返回值(undefined)
console.log函数本身(console.log)
console.log(3)函数的返回值(undefined)

区分console.log(3)表达式的值(是undefined)、打印出来的内容(是3)。

2. 语句

可能有值也可能没有,一般会改变环境(声明、赋值)。
如:var a = 1声明语句,值为undefined

二. 标识符的规则

变量名是标识符,还有其他标识符。
规则:
标识符的第一个字符可以是:

  • Unicode字母
  • $
  • _
  • 汉字 但不可以是数字

三. 条件语句

1. if else语句

1) 语法

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

语句只有一句时,{}可省,但不建议这样做。

2) 嵌套

语句1中嵌套

if (a<100)
    if (a<10)
        console.log('a小于10')

语句2中嵌套

if (a<100) {
} else if (a>1000) {
    console.log('a大于1000')
}

推荐写法:

if (表达式) {
    语句
} else if (表达式) {
    语句
} else {
    语句
}
function fn() {
    if (表达式) {
        return 表达式
    }
    if (表达式) {
        return 表达式
    }
    return 表达式
}

2. switch语句 (一般不推荐)

1) 语法

switch (fruit) {
    case "banana":
    ……
    break
    case "apple":
    ……
    break
    default:
    ……
}

3. 问号冒号表达式

1) 语法

表达式1 ? 表达式2 : 表达式3
含义:若表达式1成立,则返回表达式2,否则返回表达式3。

function abs(n) {
    return n>0 ? n : -n
}

4. && 逻辑

1) 语法

A && B && C
含义:若A为真则执行B → 若B为真则执行C。
结果:取A,B中第一个为假的表达式的值(通常不是ture或false),若A,B都为真,则执行C。

console && console.log && console.log('hi')

5. || 逻辑

1) 语法

A || B || C
含义:若A为假则执行B → 若B为假则执行C。
结果:取A,B中第一个为真的表达式的值(通常不是true或false),若A,B都为假,则执行C。

a || b

相当于

if (!a) {
    b
}

四. 循环语句

1. while循环

1) 语法

while (表达式) {
    语句
}

判断表达式的真假,若表达式为真则执行语句,之后再次判断表达式真假,……
若表达式为假,跳出循环,执行后边的语句。

var i = 0           //初始化
while (i<10) {      //判断
    console.log(i)  //循环体
    i = i + 1       //增长
}

2) 死循环

要避免死循环,如:

while (ture) {} 
var a = 0.1
while (a !== 1) {
    cosole.log(a)
    a = a + 0.1   // 浮点数导致死循环
}

2. for循环

1) 语法

for (初始化语句;判断表达式;增长语句) {
    循环体
}

先执行一次初始化语句,判断表达式为真则执行循环体,再执行增长语句;判断表达式为假则跳出循环。

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

执行后i的值为5

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

结果:打出5次5
解释:setTimeout为延时器,每一次for循环时,setTimeout都执行一次,但它里面的函数先不执行,放入等待队列里,当主线(for循环5次)执行完成后(此时i的值为5),执行等待队列里的任务(5个)。
将 var 改为 let,则打出0 1 2 3 4(for 循环 + let 有单独的逻辑)

2) 死循环

不要省略判断表达式、增长语句,否则会陷入死循环。
(初始化语句可省,放在循环前边。循环体可省。)

3. break 和 continue 语句

1) break

break表示退出当前(即距离最近的)所有循环

for (var i=0; i<10; i++) {
    if (i%2 === 1){
        break
    }
}
console.log(i)

结果:打出 1
两层循环的情况:

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

结果:打出 1 2 3 4 5 6 7 8 9
break仅退出当前所有循环,上一层仍在循环

2) continue

continue表示退出当前一次循环(next)

for (var i=0; i<10; i++) {
    if (i%2 === 1) {
        continue
    } else {
        console.log(i)
    }
}

结果:打出 0 2 4 6 8

五. label语句

1. 语法

标识符 : {
    代码块
}

区分:

{
    foo : 1;
} 

这是一个标签foo,标签语句是1

var a = {
    foo : 1;
}

这是一个对象a