是否有等效於函數原型變量的 Class？

Question

如果我有以下代碼：

function Thing() {}
Thing.prototype.cache = {};

var a = new Thing();
var b = new Thing();

a.cache === b.cache // true

我如何使用適當的 Classes重寫它？

我知道公共 class 字段，但這些字段是在實例上定義的，而不是在 class 原型上定義的。

// For Example:
class Thing {
  cache = {}
}

var a = new Thing();
var b = new Thing();

a.cache === b.cache // false

Answer 1

沒有 class 語法可以將非方法放在原型上，之后您必須將它們貼上，如下所示：

 class Thing {} Thing.prototype.cache = {} // Example usage // const thing1 = new Thing() const thing2 = new Thing() thing1.cache.x = 2 console.log(thing2.cache.x)

然而，將可變數據放在原型上被許多人視為神奇且難以遵循。 這是實現非常相似效果的另一種方法。

 // This can alternativly be a static, private variable on the class. const thingCache = {} class Thing { cache = thingCache } // Example usage // const thing1 = new Thing() const thing2 = new Thing() thing1.cache.x = 2 console.log(thing2.cache.x)

但是，我真正建議的是在 class 上將此屬性設為 static 屬性 - 這就是 static 屬性的用途，在許多實例之間共享單個數據。

 class Thing { static cache = {} } // Example usage // Thing.cache.x = 2 console.log(Thing.cache.x) // In some rare scenarios where you only have the instance, // and not the original class, you can still retrieve the original class const thing1 = new Thing() const thing2 = new Thing() thing1.constructor.cache.x = 2 console.log(thing2.constructor.cache.x)

Answer 2

您實施的稱為class field ，正如您在您的案例中注意到的那樣，它相當於：

class Thing {
  constructor() {
    this.cache = {};
  }
}

除了像在 ES5 中那樣將它附加到原型之外，您別無選擇，因為您在 class 中聲明的所有內容都是：

• 一個 class 字段（附加到實例）
• 一個方法（附在原型上）
• 一個 static 字段（附加到類）

 class Thing { } Thing.prototype.cache = {}; const obj1 = new Thing; const obj2 = new Thing; console.log(obj1.cache === obj2.cache);

我在這里發布了一個類似的問題： Not able to update a class property in ES6

附帶說明一下，由於您沒有使用constructor ，因此class是不必要的，因此您可以這樣寫：

 const proto = { cache: {} }; const obj1 = Object.create(proto); const obj2 = Object.create(proto); console.log(obj1.cache === obj2.cache);

Answer 3

您想創建一個static class 字段

然后根據 class 名稱定義 getter 和 setter。

當您希望一個字段在每個 class 中僅存在一次時，公共 static 字段非常有用，而不是在您創建的每個 class 實例上。 這對於緩存、固定配置或您不需要跨實例復制的任何其他數據很有用。

公共 static 字段使用 static 關鍵字聲明。 在使用Object.defineProperty()評估 class 時，它們被添加到 class 構造函數中。 從 class 構造函數再次訪問它們。

• 沒有初始化器的字段被初始化為未定義。
• 公共 static 字段不會在子類上重新初始化，但可以通過原型鏈訪問。
• 初始化字段時， this指的是 class 構造函數。 您也可以通過名稱引用它，並使用super獲取超類構造函數（如果存在）。

 class Thing { static _cache = {}; get cache() { return Thing._cache; } set cache(newValue) { Thing._cache = newValue; } } var a = new Thing(); var b = new Thing(); b.cache.key = "value"; console.log(a.cache === b.cache); console.log(a.cache)

Answer 4

正如 Scotty Jamison 所說，class 語法仍然沒有提供在原型本身上創建字段的方法，因此您必須使用[class].prototype.field來完成。 但是，如果您希望在 class 聲明本身中這樣做，您可以使用 static 塊：

class Thing {
    static {
        this.prototype.boofar = {};
    }
}

static 塊中的代碼將在 class 初始化時運行， this與 class 本身綁定。 可以說，這比僅在 class 聲明之后分配值更令人困惑，因為使用static可能建議使用 static 屬性，而不是繼承的屬性。 盡管如此，class 不依賴外部代碼還是不錯的。