JavaScript 类表示法和 'this' 关键字

Question

我知道还有其他一些关于这个主题的问题，但似乎都没有给出决定性的答案。

我正在构建一个 HTML/CSS/JS 移动应用程序，并且一直在尝试使用以下符号样式来定义一些类:

样式 A

var Thing = (function ()
{
    var _instance;

    var _firstName;
    var _lastName;

    function Thing(firstName, lastName)
    {
        _instance = this;

        _firstName = firstName;
        _lastName = lastName;
    }

    Thing.prototype.getMyName = function ()
    {
        return _firstName + " " + _lastName;
    }

    Thing.prototype.speak = function ()
    {
        return ("My name is " + _instance.getMyName());
    }

    return Thing;
}());

这样做的好处是:

• 成员变量被封装并可以直接引用(例如，没有 this 前缀)。
• 我可以使用 _instance 变量，从而避免围绕 this 的身份出现歧义。
• 符号相当干净且可读。

我还尝试了以下替代方案:

样式 B

function Thing(firstName, lastName)
{
    this._firstName = firstName;
    this._lastName = lastName;
}

Thing.prototype.getMyName = function()
{
    return this._firstName + " " + this._lastName;
};

Thing.prototype.speak = function()
{
    return "My name is " + this.getMyName();
};

C 样式

class Thing
{
    constructor (firstName, lastName)
    {
        this._firstName = firstName;
        this._lastName = lastName;
    }

    getMyName ()
    {
        return this._firstName + " " + this._lastName;
    }

    speak ()
    {
        return ("My name is " + this.getMyName());
    }
}

但是，尽管它们具有优势，但我发现 B 和 C 很难使用，因为与 this 关键字相关的问题；也就是说，根据调用者的上下文，this 可以引用类方法中的不同内容。此外，在这两种情况下，不可能像我在 A 中那样使用 _instance 变量，因为 all 成员需要以 this 作为前缀..

但是，正如评论中所指出的，当创建类的多个实例时，样式 A 不起作用。

编写此类类的最佳方法是什么，同时又能避免 this 出现问题？

Answer 1

如果你想不惜一切代价避免使用后期绑定(bind) this 的原型(prototype)方法，你可以在 ES6 中使用以下样式:

class Thing {
    constructor(firstName, lastName) {
        this.getMyName = () => firstName + " " + lastName;
        this.speak = () => "My name is " + this.getMyName();
    }
}

(您也可以使用 function 声明，但是 class 的优点是它会自动阻止没有 new 的调用)