箭头函数

Posted 2020-10-22 joe_ice

箭头函数不会创建自己的this, 而是使用 封闭执行上下文的this。

通过 call 或 apply 调用

由于this在词法层面上已经完成了绑定，通过call() 或者 apply()方法调用函数时，只是传入了参数而已，并不会修改this的指向，对this没有影响。

var adder = {
    base: 1,
    add: function(a) {
        var f = v => v + this.base;
        return f(a);
    },
    addCall: function(a) {
        var f = v => v + this.base;
        var base = {
            base: 2
        };
        return f.call(base, a);
    }
};
adder.add(1);
// 2
adder.addCall(1);
// 2

像方法一样使用箭头函数

看看当我们试着把它们作为方法时发生了什么

‘use strict‘;
var obj = {
    i: 10,
    b: () => {
        console.log(this.i, this);
    },
    c: function() {
        console.log(this.i, this);
    }
};
obj.b();
// VM1007:4 undefined 
 obj.c();
// 10, Object {...}

箭头函数没有定义this绑定

Object.defineProperty(bar, ‘b‘, {
    get: () => {
        console.log(this, typeof this.a, this.a);
        this.a + 1;
        // 代表全局对象 ‘Window‘, 因此 ‘this.a‘ 返回 ‘undefined‘
    }
});

使用 new 操作符

箭头函数不能用作构造器，和 new一起用会抛出错误。

使用prototype属性

箭头函数没有prototype属性

var foo = () => {};
foo.prototype // undefined

使用 yield 关键字

yield 关键字通常不能在箭头函数中使用（除非是嵌套在允许使用的函数内）。因此，箭头函数不能用作生成器