一、 let 和 const
-
ES5:
存在全局作用域 和 函数作用域；
var、function申明的变量同时也是顶层对象的属性；
存在变量提升； -
ES6:
存在全局作用域、函数作用域、块级作用域；
var、function申明的变量同时也是顶层对象的属性，但let const class申明的变量不是顶层对象的属性；
let const不存在变量提升；
- ES6中的块级作用域可以替代立即执行函数IIFE
// IIFE
(function (){
var tem = 1
console.log(tem)
}())
==>
// 块级作用域
{
let tem = 1
console.log(tem)
}
二、箭头函数
1.箭头函数没有this,它的this由其作用域链继承而来
function ArrowPerson(){
this.age=3
setInterval(()=>{this.age++},1000) //this.age指向实例中的this.age=3
}
var age=0
function FuncPerson(){
this.age=3
setInterval(function(){this.age++},1000) // this.age指向window中的age=0
}
var ap=new ArrowPerson();
var fp=new FuncPerson();
ap //从3开始计数
fp //从0开始计数
2.箭头函数作为对象方法，且包含this时，this指向全局对象
var arrow = '我是window中的this'
var obj ={
arrow : '我是obj中的this',
print : ()=>{console.log('在箭头函数中打印this.arrow结果为:'+ this.arrow)}
}
obj.print() //在箭头函数中打印this.arrow结果为:我是window中的this
3.箭头函数的闭包改写
// 原闭包函数
function add(){
var i=0
return function incre(){
return (++i)
}
}
var Counter = add()
Counter() //1
Counter() //2
Counter() //3
//箭头函数闭包
var add = (i=0)=>{return (()=>(++i))}
var Counter = add()
Counter() //1
Counter() //2
Counter() //3
三、默认参数
1.函数定义时可以传入默认参数，调用时如果未传入实参，就用默认参数
function add(a, b=2){
return a+b
}
add(1) //3
add(1,4) //5
add() //NaN 等同于undefined+2
四、...theArgs使用方法
1.作为剩余参数 用法（可以使用数组的方法）
...theArgs与arguments最大的区别是：arguments不是数组实例，在上面不可以直接使用数组方法；而...theArgs直接可以使用数组方法
function multiply(multiplier,...theArgs){
return theArgs.map(function(ele){
return multiplier*ele
})
}
multiply(2,1,2,3) // 2=>multiplier, theArgs=>[1,2,3]
var result=multiply(2,1,2,3) // result=>[2,4,6]
2.作为展开语法（可以拆开数组）
//2.1 等同于slice,可以用来浅拷贝
var arr = [1,2,1,7]
var copyArr=[...arr]
copyArr.push(4) //[1,2,1,7,4] 对arr没有影响
//2.2 相当于apply用法：把数组传入函数参数中
var args= [1,2,3]
function f(a,b,c){
}
f(...args) // 等同于f.apply(null,args)
//2.3 concat用法
var arr1=[1,2]
var arr2=[3,4]
var arr3=[...arr1,...arr2] //等同于arr1.concat(arr2)
//2.4略等同于unshift
var arr1=[1,2]
var arr2=[3,4]
var arr3=[...arr2,...arr1] //Array.prototype.unshift.apply(arr1,arr2) 结果一致，但是这种方式改变了原来arr1
//2.5 浅拷贝和合并字面量对象
var obj1 = { foo: 'bar', x: 42 };
var obj2 = { foo: 'baz', y: 13 };
var clonedObj = { ...obj1 };
// 克隆后的对象: { foo: "bar", x: 42 }
var mergedObj = { ...obj1, ...obj2 };
// 合并后的对象: { foo: "baz", x: 42, y: 13 }
五、结构赋值
使得将值从数组，或属性从对象，提取到不同的变量中，成为可能。
解构赋值语法中，表达式左边定义了要从原变量（表达式右边）中取出什么变量。也就是把右边解构了之后赋值给左边～
- 数组匹配 [ b, a ] = [ 1, 2 ]
- 对象匹配 let { a, b, c } = objABC
- 参数匹配 function g ({ name: n, val: v }) {}
var obj = [1, 2, 3, 4, 5];
var [y, z] = obj; //将obj解构，取第一二个值分别赋给y z；
console.log(y); // 1
console.log(z); // 2
六、模版字符串-可以实现在字符串中潜入表达式，语法：
` ${expression} `
网友评论