ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript で「new」キーワードを使用せずにクラス コンストラクターを呼び出すことはできますか?
ES6 では、クラスはカプセル化と継承のための簡潔な構文を提供します。ただし、「new」キーワードを使用せずにクラス コンストラクターを呼び出すと、障害が発生する可能性があります。
次のクラスについて考えてみます。
<code class="javascript">class Foo { constructor(x) { if (!(this instanceof Foo)) return new Foo(x); this.x = x; } hello() { return `hello ${this.x}`; } }</code>
直感的には、次のコードが機能することが期待されるかもしれません。
<code class="javascript">Foo("world").hello(); // "hello world"</code>
ただし、この試みは「クラスを関数として呼び出すことはできません」というエラーで失敗します。
JavaScript では、クラスは "クラス本体」がコンストラクターとして機能します。このコンストラクターは、クラスが呼び出されるときに呼び出され、クラスのインスタンスが作成されます。したがって、コンストラクターを開始して新しいオブジェクトを作成するには、「new」キーワードを使用することが不可欠です。
主なアプローチは 3 つあります。この制限を克服するには:
クラスを使用する代わりに、同様に動作する通常の関数を定義できます。
<code class="javascript">function Foo(x) { if (!(this instanceof Foo)) return new Foo(x); this.x = x; this.hello = function() { return this.x; } }</code>
クラスが常に「new」キーワードで呼び出されるようにするために、コンストラクター内にチェックを実装できます。
<code class="javascript">class Foo { constructor(x) { if (!(this instanceof Foo)) throw new Error("Class must be invoked with 'new'"); this.x = x; } hello() { return `hello ${this.x}`; } }</code>
通常の関数内でクラスをラップすることにより、「new」キーワードを使用しても使用しなくてもクラスを呼び出すことが可能になります。
<code class="javascript">class Foo { constructor(x) { this.x = x; } hello() { return `hello ${this.x}`; } } var _old = Foo; Foo = function(...args) { return new _old(...args) };</code>
各ソリューションには独自のトレードオフがあります。 。通常の関数にはクラスのカプセル化と継承の利点がありませんが、強制された 'new' キーワードにより特定のシナリオでは柔軟性が制限される可能性があります。ラッピング関数のアプローチは、両方のオプションのバランスをとります。
以上がJavaScript で「new」キーワードを使用せずにクラス コンストラクターを呼び出すことはできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。