ES6( ECMAScript 6.0)语法

一、let/const与var的区别

var 会进行预解析，let/const不会
var可以声明两个重名的变量，let/const不能
var没有块级作用域，let/const有块级作用域

二、箭头函数

1.普通函数

//xxx.onclick=function(a=10,b=20){ }  可以为函数设置默认值，没传参数就用默认值xxx.onclick=function(){ }var xxx={fn:function(){} }xxx.forEach(function(){})setTimeout(function(){})var xxx=function(){}

2.箭头函数

格式：把普通函数的function去掉，再在小括号后面加上j箭头符号（=>）

xxx.onclick=()=>{ }var xxx={fn:()=>{} }xxx.forEach(()=>{})setTimeout(()=>{})var xxx=()=>{}

三、结构赋值

1.以前数组

let arr=[\'hello\',\'world\']let a=arr[0]let b=arr[1]

2.解构赋值

let [a,b]=[\'hello\',\'world\']console.log(a)console.log(b)

四、解构赋值-解构对象（键值对）

1.以前获取对象

let obj={name:\"小明\"age:20}let name=obj.namlet age=obj.nam

2.解构赋值

let obj={name:\"小明\"age:20}//定义两个变量name和age，并获取obj里的name和age的值let{name,age}=obj //如同 let name=obj.nam ,let age=obj.namconsole.log(name,age)//定义一变量a（为name取个别名a）let{name:a}=obj

五、E6_模板字符串反引号使用

作用：

1. 给变量赋值时可以换行
2. 可以配合${ 变量 }来解析变量

//给变量赋值时可以换行var a=`helloworld`//输出也保持换行console.log(a)//可以配合${ 变量 }来解析变量var name=\"小明\"var s=`他的名字是${name}`console.log(s)//输出为：他的名字是小明

六、E6_展开运算符

格式： . . . 数组或 . . . 对象（键值对）
作用：把数组或键值对展开（把中括号和大括号去掉）

用途1：合并数组或键值对

//数组合并var s1=[10,20]var s2=[30,40]var s3=[50,60,70]var s=[...s1,...s2,...s3]console.log(s)//输出结果:[10,20,30,40,50,60,70]//键值对合并var s1={name:\"小明\",age:12}var s2={sex:\"男\",hight:170}var s={...s1,...s2}console.log(s)//结果：{name: \'小明\', age: 12, sex: \'男\', hight: 170}

用途2：给函数传值

//求数组里的最大值var s=[2,4,5,7,20,4]var max=Math.max(...s)//如同：max=Math.max(2,4,5,7,20,4)//结果为：20

七、E6_类语法

格式：

class 类名{

constructor( 形参列表 ){

this.属性名=形参1

this.属性名=形参2

}

//直接写方法就行

方法名( ){ 方法体 }

//静态属性和方法，加一个static

static a=100

static hi( ){ 方法体 }

}

//E6的类class  Person{constructor(name,age){this.name=namethis.age=age}//方法sayHi(){ console.log(\"你好，世界！\") }//静态属性和方法，加一个 staticstatic a=100static to()function{ console.log(\"大家好\") }}//创建对象var p1=new Person(\"小明\",20)//执行方法p1.sayHi()//执行静态属性和方法Person.aPerson.to()