如何将箭头函数与主类“ this”属性一起使用?

时间:2018-12-13 13:01:58

标签: javascript ecmascript-6

我竭尽全力在nodeJS中创建一种算法。我得到了一个具有以下功能的文件,其中某些属性与this关联,而某些功能与prototype关联。

function Main(controller) {
        this.tipo = "string";
        this.controller = controller;
        this.debug = controller.debug;
        this.db = controller.db;
        this.util = require('util');
        this.utils = require('../utils.js');
        this.moment = require('moment');
}

Main.prototype.funcX = (dados) => {
        // doing stuffs
}

以某种方式,this的属性在与prototype绑定的函数中未被识别,并且始终存在TypeError。

然后,在阅读本question之后,我发现了一个解决方案,在其中我注意到arrow函数具有自己的this上下文。然后,更改此代码段

Main.prototype.funcX = (dados) => {
    // doing stuffs
    console.log(typeof this.db) // TypeError: cannot read property 'info' of undefined
};

对此

 Main.prototype.funcX = function (dados) {
     // doing stuffs 
     console.log(typeof this.db) // prints my db instance
 };

一切正常。

但是我根本不想在这些功能上使用function关键字。

问::使用箭头功能访问Main的this属性的最佳方法是什么?

2 个答案:

答案 0 :(得分:3)

实际上,无法通过构造函数原型附带的箭头函数访问正确的this

"use strict";
function Main() {};
Main.prototype.foo = () => console.log(this);
var m = new Main();
m.foo(); // undefined
m.foo.call(m); // still undefined
m.foo.bind(m)(); // you get the idea

箭头函数的this像普通的var一样在词法范围内关闭,在这种情况下,它是全局(或顶级模块)范围。如果您删除"use strict",则只会得到window而不是undefined

您有几种选择:

不要在原型上定义(实际上不要这样做):

function Main() {
  this.foo = () => console.log(this);
}

m = new Main();
m.foo(); // correct this!

之所以可行,是因为arrow函数在构造函数的词法范围内关闭了正确的this。但是在这里,您失去了实例之间仅共享一个功能对象的优点(因为您没有使用原型)。

使用常规功能

该问题已经发布在您的问题中,因此无需重复。

使用方法定义类

class Main {
  foo () {
    console.log(this);
  }
}

m = new Main();
m.foo(); // correct this

答案 1 :(得分:1)

如您所说,您不能将上下文与箭头功能一起使用。我猜下一个最好的选择是创建一个封闭的作用域,以在箭头功能内使用:

{ // that
    let db = something;

    Main.prototype.funcX = (dados) => {

        console.log(db + "is only available from inside that block");

    };
}

但是,正如评论中指出的那样,您仍然缺少箭头功能。