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' }
注意:当展开一个对象实例时,会丢失其方法。