ES6箭头函数

首先看一段代码

x => x * x

这是ES6的写法，相当于

function (x) {
    return x * x;
}

箭头函数相当于匿名函数，并且简化了函数定义。箭头函数有两种格式，一种像上面的，只包含一个表达式，连{ ... }和return都省略掉了。还有一种可以包含多条语句，这时候就不能省略{ ... }和return。

x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}

箭头函数还完美的解决了this作用域的问题

function foo() {
    setTimeout(() => {
        console.log('id:', this.id);
    }, 100);
}
var id = 21;
foo.call({
    id: 42
});
// id: 42

如果这里的setTimeout不使用箭头函数的话，this将指向的是window，但是使用了箭头函数，this就指向了函数定义生效时所在的对象，这里的对象就是{id: 42}，所以输出的结果为42。

如果觉得我的文章对您有用，请您随意打赏。您的支持将鼓励我更加努力创作！

如无特殊声明，文章均为原创，若有不正之处，万望告知。转载请附上原文地址，十分感谢！