ES6的一些小技巧

箭头函数

Tip:黑色为基础写法，红色为es6写法（es6，即JavaScript的更新语法）

随着ES6的普及，ES6新语法的应用也越被大家所接受，箭头函数这一点算是ES6最入门的一个点了，除了语法简单以外，this指向的问题也更清晰。

functionsayHi(n){console.log(n);}sayHi=n=>concole.log(n)

定时器简写

定时器的简写，其实还是基于箭头函数的，将定时器中需要执行的函数通过箭头函数的方式来书写。

setTimeout(function(){console.log('name');},2000)setTimeout(()=>console.log('name'),2000);

遍历简写

需要用到函数的地方，通通用箭头函数去替换，当然遍历的方法不仅仅是forEach，还有map,each等方法

list.forEach(function(n){console.log(n);})list.forEach(n=>console.log(n));

隐式返回值简写

仍然是箭头函数的范畴，但是相比起之前只是替换函数，这里则包含了另一个知识点，即return返回值的问题。

functioncalc(die){returnMath.PI*die;//需要主动return}calc=die=>(Math.PI*de)//没有{}大括号函数体时，默认将结果返回varfunc=functionfunc(){return{foo:1};}varfunc=()=>({foo:1});

数据解构

数据结构是ES6之中，对于赋值，值传递的一大变化了，简化了复制的操作，自动对对象、数组进行，数值交换等，在实际开发中可以极大的简化代码，提到代码可读性,并且不丢失代码的可读性。

//写法一，赋值varx='a',y='b';var[x,y]=['a','b'];//等价写法//写法二，值交换vartemp=x;x=y;y=temp;[x,y]=[y,x]//等价写法//对象简写varx='a',y='b';obj={x:x,y:y};var[x,y]=['a','b'],//等价写法obj={x,y};

形参默认值

在调用函数式，为了避免形参空值，我们通常需要判断一下参数是否存在值，为空值，赋一个默认值，而ES6中则简化这一步。

functionget(bool){if(bool=null)bool=true;console.log(bool);}get();//true;//等价写法functionget(bool=true){console.log(bool);}get()//true