首頁 > web前端 > js教程 > 主體

使用 ES6 類別擴展函數時如何從函數呼叫存取類別實例

Linda Hamilton
發布: 2024-10-21 06:03:30
原創
633 人瀏覽過

How to Access Class Instance from Function Invocation when Extending Functions with ES6 Classes

使用 ES6 類別擴充函數

在 ES6 中,程式設計師有能力擴充特殊對象,包括函數。透過使用繼承,從函數衍生類別變得可行。雖然這些擴展對象可以像函數一樣被調用,但為這些調用實現適當的邏輯可能會帶來挑戰。

這種情況下出現一個重要問題:呼叫物件時如何取得類別實例的參考作為一個函數,考慮到常規方法透過此獲得存取權限?不幸的是,在這些情況下,這個引用指向全域物件(視窗)。

解決方案:

為了解決這個問題,可以採用閉包的概念,從而創建一個封裝對實例變數的存取的回傳函數。這是一個例子:

class Smth extends Function {
  constructor(x) {
    super(() => { return x; });
  }
}
登入後複製

在此範例中,建構函數中的超級表達式啟動函數建構函數,需要一個表示要執行的程式碼的字串。然而,存取實例資料並不簡單,因此採用了硬編碼方法,產生了所需的結果:

console.log((new Smth(256))()); // Logs: 256
登入後複製

實現相同目標的另一種方法涉及操作原型鏈:

class Smth extends Function {
  constructor(x) {
    const smth = function() { return x; };
    Object.setPrototypeOf(smth, Smth.prototype);
    return smth;
  }
}
登入後複製

此方法允許傳回的函數成為能夠存取實例變數的閉包,從而提供了更大的靈活性。

此外,可以將此功能抽象化為可重複使用的實用程式:

class ExtensibleFunction extends Function {
  constructor(f) {
    return Object.setPrototypeOf(f, new.target.prototype);
  }
}

class Smth extends ExtensibleFunction {
  constructor(x) {
    super(() => { return x; });
  }
}
登入後複製

這種方法在繼承層次結構中創建了額外的間接級別,但在某些情況下它可能是有益的。此外,可以透過使用以下構造來避免這種情況:

function ExtensibleFunction(f) {
  return Object.setPrototypeOf(f, new.target.prototype);
}
ExtensibleFunction.prototype = Function.prototype;
登入後複製

但請注意,在這種情況下,Smth 不會動態繼承靜態 Function 屬性。

以上是使用 ES6 類別擴展函數時如何從函數呼叫存取類別實例的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!