1.什么是ES6?
ES的全称是ECMAScript,ES6就是ES2016之后的一个泛称,是由ECMA国际标准化组织制定的一项脚本语言的标准化规范。
2.ES6新增语法
1. let
ES6中新增的用于声明变量的关键字
特点:
1.let声明的变量具有块级作用域的特点,只在所处的块级作用域有效
if(true) {
let a = 10;
}
console.log(a); // a is not defined
2.不存在变量提升
console.log(a); //a is not defined
let a = 10;
3.暂时性死区
利用let声明的变量会绑定在当前作用域,哪怕当前作用域外有相同变量名,也不会受影响。
2.const
声明常量,常量就是值(内存地址)不能变化的量。
特点:
1.具有块级作用域的特点
if(true) {
const a = 10;
}
console.log(a); // a is not defined
2. 声明常量时必须赋值
const p; //Missing initializer in const declaration
不赋值则会报错
3. 常量赋值后,值不能修改
1 const p = 3; 2 p = 100; //Assignment to constant variable. 3 4 5 const arr = [10,20]; 6 7 arr[0] = 'a'; 8 9 arr[1] = 'b'; 10 11 console.log(arr); //["a","b"]; 12 13 //直接给数组重新赋值则会报错 14 arr = ["a","b"] //Assignment to constant variable.
常量不能重新进行赋值,如果是基本数据类型,不能更改值,如果是复杂数据类型,不能更改地址值。
3.解构赋值
在ES6中允许从数组中提取值,按照对应位置,对变量赋值,对象也可以实现解构
1.数组解构
let[a,b,c] = [1,2,3];
console.log(a,b,c); //输出结果 1 2 3
如果解构不成功,变量的值是undefined
2.对象解构
let person = {name:'书记',age:22};
let{name, age} = person;
console.log(name,age) // 输出结果 '书记' 22
let {name: myName, age: myAge} = person; // myName myAge 属于别名
console.log(myName); // 'zhangsan'
console.log(myAge); // 20
小结:
解构赋值就是把数据结构分解,然后给变量进行赋值
如果解构不成功,变量跟数值个数不匹配的时候,变量的值为undefined
数组解构用中括号包裹,多个变量用逗号隔开,对象解构用花括号包裹,多个变量用逗号隔开
利用解构赋值能够让我们方便的去取对象中的属性和方法
4.箭头函数
ES6新增的定义函数的方式
() => {} //()代表函数,=>必须要给的符号,指向那一块代码 {}函数体
const fn() => {} //代表把一个函数赋值给fn
特点:
1.如果函数体只有一句代码,且代码的执行结果就是返回值,可以省略大括号
function fn(n1,n2){ return n1 + n2; } //ES6箭头函数写法 const fn = (n1,n2)=>n1 +n2;
2.如果形参只有一个,可以省略小括号
function fn(num){ return num; } //ES6箭头函数写法 const fn = num => num;
3. 箭头函数不绑定this,箭头函数中的this指向的是函数定义位置的上下文this
5.剩余函数
在不知道有多少个参数的时候使用,允许我们将一个不定数量的参数表示为一个数组,不定参数定义方式,这种方式很方便的去声明一个不知道参数情况下的一个函数
语法 ...
function sum (first,...args){ console.log(first); // 10 console.log(args); // [20,30] } sum(10,20,30);
剩余参数和解构配合使用