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

如果您觉得本文对您有用,欢迎捐赠或留言~
微信支付
支付宝

发表评论

您的电子邮箱地址不会被公开。 必填项已用 * 标注