ES6 類中的箭頭與經典方法

Question

有沒有理由編寫 ES6 方法的經典語法？

class MyClass {

    myMethod() {
        this.myVariable++;
    }

}

當我使用myMethod()作為某個事件的回調時，我必須寫這樣的東西（在 JSX 中）：

// Anonymous function.
onClick={() => { this.myMethod(); }}

// Or bind this.
onClick={this.myMethod.bind(this)}

但是如果我將方法聲明為箭頭函數：

class MyClass {

    myMethod = () => {
        this.myVariable++;
    }

}

比我能寫的（在 JSX 中）：

onClick={this.myMethod}

Answer 1

您使用的功能不是 ES6 的一部分。 這是類字段提案。 它允許您在無需編寫構造函數的情況下初始化實例屬性。 即你的代碼：

class MyClass {

    myMethod = () => {
        this.myVariable++;
    }

}

完全一樣

class MyClass {

    constructor() {
        this.myMethod = () => {
            this.myVariable++;
        };
    }

}

這也向您展示了普通類方法和通過類字段創建的 a 方法之間的區別：

所以與在 JavaScript中使用“原型”與“這個”中提出的原因相同嗎？ 申請，但簡而言之：

如果每個實例需要一個方法，請使用“類字段方法”。 需要訪問當前實例的事件處理程序就是這種情況。 僅當您使用箭頭功能時，才能訪問this功能。
在所有其他情況下使用普通的類方法。