当ES6 Arrow函数似乎无法为使用prototype.object的对象分配功能时。请考虑以下示例:
function Animal(name, type){ this.name = name; this.type = type; this.toString = () => `${this.name} is a ${this.type}`; } var myDog = new Animal('Max', 'Dog'); console.log(myDog.toString()); //Max is a Dog
在对象定义中显式使用arrow函数是可行的,但将Object函数与Object.prototype语法一起使用却不能:
function Animal2(name, type){ this.name = name; this.type = type; } Animal2.prototype.toString = () => `${this.name} is a ${this.type}`; var myPet2 = new Animal2('Noah', 'cat'); console.log(myPet2.toString()); //is a undefined
就像概念证明一样,将Template字符串语法与Object.prototype语法一起使用确实可以:
function Animal3(name, type){ this.name = name; this.type = type; } Animal3.prototype.toString = function(){ return `${this.name} is a ${this.type}`;} var myPet3 = new Animal3('Joey', 'Kangaroo'); console.log(myPet3.toString()); //Joey is a Kangaroo
我是否缺少明显的东西?我觉得示例2应该在逻辑上起作用,但是我对输出感到困惑。我猜这是一个范围界定的问题,但是输出“是未定义的”让我望而却步。
箭头函数提供了一个词法this。它使用this功能评估时可用的。
this
从逻辑上讲,它等效于(以下无效代码,因为您不能拥有名为的变量this):
(function(this){ // code that uses "this" })(this)
在您的第一个示例中,arrow函数在构造函数中,并this指向新生成的实例。
在您的第三个示例中,未使用箭头函数,并且标准this行为照常运行(函数范围中的this)。
在第二个示例中,您使用了箭头功能,但是在评估范围内,它this是全局的/未定义的。