ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript の「new」演算子は内部でどのように機能しますか?また、この演算子を使用したオブジェクト作成に関係する主要な手順は何ですか?

JavaScript の「new」演算子は内部でどのように機能しますか?また、この演算子を使用したオブジェクト作成に関係する主要な手順は何ですか?

DDD
リリース: 2024-10-28 16:49:30
オリジナル
635 人が閲覧しました

How does the

JavaScript の "new" 演算子の内部動作を理解する

JavaScript の謎めいた側面の 1 つと考えられる "new" 演算子オブジェクト作成におけるその役割が開発者を魅了してきました。この記事では、「新しい」演算子の複雑なメカニズムを詳しく掘り下げ、別の実装を通じてその本質を明らかにします。

「新しい」演算子の背後にある関数

「新しい」演算子は、それに続く関数の [[Construct]] メソッドを内部的に呼び出します。このメソッドは、オブジェクト作成プロセスで重要な役割を果たします。

  1. オブジェクトの初期化:

    • 元のネイティブ JavaScript オブジェクトを初期化します。 .
  2. Prototype Linkage:

    • 新しく作成されたオブジェクトの内部 [[Prototype]] プロパティ間の接続を確立します
    • 関数のプロトタイプ プロパティがオブジェクトではない場合、代わりに Object.prototype が選択されます。
  3. 関数呼び出し:

    • 「new」演算子に関連付けられた関数が実行され、新しく作成されたオブジェクトが「this」値として利用されます。

戻り値の謎

「new」演算子の結果は、呼び出された関数の戻り値に依存します:

  • プリミティブ リターンValue: 関数がプリミティブ値 (例: Number、String) を返す場合、内部的に作成されたオブジェクトが返されます。
  • Object Return Value: 関数がオブジェクトを返す場合、内部オブジェクトは破棄され、返されたオブジェクトが優先されます。

代替実装

「new」演算子の内部動作を理解するために、次のことを考えてみましょう。その動作を模倣する代替実装を検討します:

<code class="javascript">function NEW(f) {
  var obj, ret, proto;

  proto = Object(f.prototype) === f.prototype ? f.prototype : Object.prototype;
  obj = Object.create(proto);
  ret = f.apply(obj, Array.prototype.slice.call(arguments, 1));

  if (Object(ret) === ret) {
    return ret;
  }
  return obj;
}</code>
ログイン後にコピー

使用例:

<code class="javascript">function Foo (arg) {
  this.prop = arg;
}

Foo.prototype.inherited = 'baz';

var obj = NEW(Foo, 'bar');

console.log(obj.prop);          // 'bar'
console.log(obj.inherited);     // 'baz'
console.log(obj instanceof Foo); // true</code>
ログイン後にコピー

結論

スルーこの代替実装により、オブジェクトの作成とプロトタイプ チェーンの確立における「新しい」オペレーターの重要な役割について包括的な理解が得られました。その複雑なメカニズムを理解すると、開発者は JavaScript のオブジェクト指向プログラミング機能を活用できるようになります。

以上がJavaScript の「new」演算子は内部でどのように機能しますか?また、この演算子を使用したオブジェクト作成に関係する主要な手順は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート