ES6 クラスで関数を拡張するときに関数呼び出しからクラス インスタンスにアクセスする方法

ES6 クラスによる関数の拡張

ES6 では、プログラマーは関数を含む特殊なオブジェクトを拡張できます。継承を使用すると、関数からクラスを派生することが可能になります。これらの拡張オブジェクトは関数のように呼び出すことができますが、これらの呼び出しに適切なロジックを実装することは課題を引き起こす可能性があります。

このシナリオでは 1 つの重要な疑問が生じます。それは、オブジェクトが呼び出されたときにクラス インスタンスへの参照を取得する方法です。通常のメソッドがこれを介してアクセスできることを考慮すると、関数として機能しますか?残念ながら、このような場合、この参照はグローバル オブジェクト (ウィンドウ) を指します。

解決策:

この問題に取り組むには、クロージャの概念を使用できます。インスタンス変数へのアクセスをカプセル化する戻り関数を作成します。以下に図を示します。

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 中国語 Web サイトの他の関連記事を参照してください。