ES6-箭头函数

es6中新增了一个箭头函数，主要用来简化匿名函数的编写。

箭头函数一般用于这种方式：var fun = function(){}，将函数赋值给一个变量的时候。如果是function fun = {}，这种函数本身有名字的就不适用使用箭头函数。

1 基本写法

var fun = function(){}用箭头函数写就是：var fun = ()=>{};

2 有一个参数的函数

var fun = function(a){console.log(a);}用箭头函数写法var fun = (a)=>{console.log(a)};，当只用一个参数的时候也可以省略掉参数外面的括号：var fun = a=>{console.log(a);}

3 多个参数的函数

var fun = function(a,b){console.log(a+b);}用箭头函数写法var fun = (a,b)=>{console.log(a+b)};，多个参数外面的括号不能省略

4 函数体只有一条语句的时候，可以省略函数体外层的大括号，并且该条语句执行结果默认就是函数的返回值

var fun = function(a){console.log(a);}用箭头函数写法可以写成var fun = a=>console.log(a);

var fun = function(a,b){a+b;}用箭头函数写法可以写成var fun = (a,b)=>a+b;，调用函数 console.log(fun(10,20));输出结果是30

5 箭头函数中this的指向

在一般定义的函数中，this指向调用它的那一个对象。而在箭头函数中的this不是这样的指向，在箭头函数中如果有外层函数，则箭头函数中的this指向外层函数的this，如果没有外层函数则箭头函数的this指向window。

例，有两个button，id分别是btn1和btn2，用一般函数和箭头函数给他们的点击时间添加函数，点击后打印该函数的this；

let btn1 = document.getElementById('btn1');

let btn2 = document.getElementById('btn2');

btn1.onClick = function(){console.log(this);}

btn2.onClick = ()=>{console.log(this);}

分别点击两个按钮，btn1打印的this就是指向btn1按钮，而btn2打印的this指向window