var声明

声明的为全局变量。

for(var i = 0; i < 10; i++) {

    setTimeout(() => {

        console.log(i);

    }, 100 * i)

}

结果：10,10,10，。。。。。。（10个）

let声明

声明的变量为局部变量，作用域为块作用域。

for(let i = 0; i < 10; i++) {

    setTimeout(() => {

        console.log(i);

    }, 100 * i)

}

结果： 0， 1， 2， 3， 4， 5， 6， 7， 8， 9

const声明

const和let拥有相同的作用域规则，只是const不能被赋值。其实也只是不能整体赋值，给单独的元素赋值是合法的。

const all = {

    name: 'xiaoming',

    age: 10,

};

// error

all = {

    name: 'honghong',

    age: 18,

};

// right

all.name = 'honghong';

all.age++;

let vs const

使用原则：最小特权原则，既所有变量的定义，除了你计划去修改的，都应该使用const去定义。

解构

数组解构

let [ 1, 2 ] = input;

最简单的结构：

let [ first, second ] = input;

console.log(first); // 1

console.log(second); // 2

作用于函数参数：

function f([ first, second ]: [ number, number ] ) {

    console.log(first, second); 

}

f(input); // 1, 2

可以在数组里使用...语法创建剩余变量：

let [ first, second, ...rest ] = [ 1, 2, 3, 4 ];

console.log(first, second); // 1, 2

console.log(rest);  // [ 3, 4 ]

你可以忽略你不关心的元素：

let [ first ] = [ 1, 2 ,3, 4 ];

console.log(first); // 1

let [ , second, , fourth ] = [ 1, 2, 3, 4 ];

console.log(second, fourth); // 2, 4

对象解构

let person = {

    name: 'xiaoxiao',

    school: 'beijing',

    age: 12,

};

最简单的形式：

let { name } = person; // 'xiaoxiao'

let { name, ...rest} = person;

console.log(name); // 'xiaoxiao'

console.log(rest); // { school: 'beijing', age: 12 }

属性重命名：新名称写在冒号后面

let { name: newName, school: newSchool } = person;

默认值：

function keep(ol: { a: number, b?: number }) {

    let { a, b = 1002 } = ol;

} // 当没有传入b参数时，b变量使用默认值1002

展开

数组展开：

let first = [ 1, 2 ];

let second = [ 3, 4 ];

let third = [ ...first, ...second, 5]; // [ 1, 2, 3, 4, 5 ]

对象展开：

let first = {

    name: 'apple',

    color: 'red',

};

let second = {

    price: 4,

    size: 'big',

};

let all = { ...first, ...second, color: 'yellow' }; // { name: 'apple', color: 'yellow', price: 4, size: 'big' }

注意：当展开一个对象实例时，会丢失其方法。