JavaScript箭头函数

ES6新语法箭头函数

箭头函数是ES6新语法，因为语法简单、可读性好，所以使用的也很多。箭头函数也是匿名函数，区别于匿名函数的是箭头函数是一个带返回值的表达式，

• 语法如下：

参数 => 函数体;

• 写成普通函数：

var fun = x => x*x;
//等价于下面
var fun = function (x){
    return x*x;
}

• 多个参数：

var fun = (x,y) => x*y;//多个参数时需要括号

• 函数体多行时：

var fun = (x,y) => {
    let result = x*y;//多行语句用{}包裹起来
    return result;
}

• 返回对象时：

var fun = (id,name) => ({id: id, name: name});//使用()将对象返回

箭头函数this的问题

箭头函数不能作为构造函数，并且没有自己的this，arguments，super或new.target，因此箭头函数表达式更适用于那些本来需要匿名函数的地方。在箭头函数出现之前，每一个新函数根据它是被如何调用的来定义这个函数的this值：

• 如果该函数是一个构造函数，this指针指向一个新的对象
• 在严格模式下的函数调用下，this指向undefined
• 如果该函数是一个对象的方法，则它的this指针指向这个对象

箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this。因此，在下面的代码中，传递给setInterval的函数内的this与全局作用域中的this值相同：

var a = 1;
setInterval(()=>{
    console.log(this.a);//a=1
},1000);

适用场景

因为箭头函数this继承于上一作用域的特性，所以需要将外部 this 传递到回调函数中的情况就特别适合使用箭头函数。

function Person(name,age){
    this.name = name;
    this.age = age;
    this.greet = () => {
        console.log(this.name+this.age);//this继承于构造函数Person
    }
}
var person = new Person("Cherry",18);
person.greet();//Cherry18

当然箭头函数就不适用于前面的构造函数部分了。