Es6新增语法
-
let声明变量
- let声明的变量只在所处于的块级有效
if(true) {
let a = 10;
}
console.log(a) // a is not defined
- 在业务逻辑比较复杂时,能够防止内层变量覆盖外层变量
- 拥有块级作用域的变量还有一个好处 防止循环变量变成全局变量
- 不存在变量提升 只能先声明再使用
console.log(a); // a is not defined
let a = 20
- 暂时性死区 在块级作用域内使用let关键字声明的变量会被整体绑定在这个块级区域 不再受外部代码影响
var temp = 123;
if(true) {
temp = 'abc';
let temp;
}
-
const 声明常量,常量就是值(内存地址)不能变化的量**
- 具有块级作用域
if(true) {
const a = 10;
}
console.log(a); // a is not defined
- 声明常量时必须赋值
const PI; // 丢失了初始值
- 常量赋值后,值不能修改
对于基本数据类型来讲,一旦赋值 值不可更改,比如数值或者字符串
对于复杂数据类型来讲,不能重新赋值,但是可以更改数据结构内部的值 比如数组或者对象
const PI = 3.14;
PI = 100; // Assignment to constant variable 不能更改此常量的值
const ary = [100, 200];
ary[0] = 'a';
ary[1] = 'b';
console.log(ary); // ['a', 'b']
ary = ['a', 'b']; // Assignment to constant variable
-
let、const、var的区别:
- 使用var声明的变量,其作用域为该语句所在的函数内,且存在变量提升现象,函数级作用域,值可更改
- 使用let声明的变量,其作用域为该语句所在的代码块内,不存在变量提升,块级作用域,值可更改
- 使用const声明的是常量,在后面出现的代码中不能再修改该常量的值,块级作用域,值不可更改
-
解构赋值:
-
分解数据结构 为变量赋值,ES6中允许从数组中提取值,按照对应位置,对变量赋值,对象也可以实现解构
-
数组解构:将数组中的值提取出来,然后赋值给另外的变量
let [a, d, c] = [1, 2, 3];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3
//解构不成功则为undefined
let [foo] = [];
let [bar, foo] = [1];
- 对象结构:{变量名} = {具体被解构的对象} ,实际上是属性匹配 变量的名字匹配对象中属性的名字 如果匹配成功 就将对象中属性的值赋值给变量
let person = {name: 'zhangsan', age: 20};
let {name, age} = person;
console.log(name); // 'zhangsan'
console.log(age); // 20
- 第二种写法:
let {name: myName, age: myAge} = person; // myName myAge属于别名
console.log(myName); // 'zhangsan'
console.log(myAge); // 20
-
箭头函数
- 箭头函数不绑定this关键字,箭头函数中的this,指向的是函数定义位置的上下文this 箭头函数被定义在哪 箭头函数中的this就指向哪
-
剩余参数
- 当函数实参个数大于形参个数时,我们可以将剩余的实参放到一个数组中,剩余参数语法允许我们将一个不定数量的参数表示为一个数组
function sum (first, ...args) {
console.log(first); // 10
console.log(args); // [20, 30]
}
sum(10, 20, 30);
- 剩余参数和解构配合使用
let students = ['wangwu', 'zhangsan', 'lisi'];
let [s1, ...s2] = students;
console.log(s1); // 'wangwu'
console.log(s2); // ['zhangsan', 'lisi']
-
展开运算符
- 展开运算符可将数组或者对象转为用逗号分隔的参数序列
let ary = [1, 2, 3];
...ary; // 1, 2, 3
console.log(...ary); // 1 2 3 参数序列中的逗号被当作方法的参数分隔符