JavaScript の new 演算子の原理と例の詳細な説明

新しい用途

new の機能は、コンストラクターを通じてインスタンス オブジェクトを作成することです。インスタンス、プロトタイプ、コンストラクターの関係は次の図に示されています。

まずはまとめましょう

1. 空のオブジェクトを作成する
2. 空のオブジェクトの内部プロパティ __proto__ が、コンストラクター関数の prototype プロパティに割り当てられます。
3. コンストラクタの this を空のオブジェクトを指すように設定します
4. コンストラクタ内のコードを実行する
5. 新しいオブジェクトを返す

詳細な説明

新しい操作を実行すると、次の手順が順番に実行されます。

1. 空のオブジェクトを作成する

• 空のオブジェクトは Object のインスタンス、つまり {} です。

obj = {} とします

2. 空のオブジェクトの内部プロパティ__proto__がコンストラクタのプロトタイププロパティに割り当てられます。

• この操作は、空のオブジェクトを正しいプロトタイプにリンクすることです。

関数Foo(num) {
  this.number = 数値
}

obj.__proto__ = Foo.prototype

3. コンストラクタのthisを空のオブジェクトにポイントする

• つまり、コンストラクター内の this は空のオブジェクトに割り当てられ、後でコンストラクターが正しく実行されるようになります。

Foo.call(obj, 1)

4. コンストラクタ内のコードを実行する

• つまり、空のオブジェクトにプロパティとメソッドを追加します。

5. 新しいオブジェクトを返す

• コンストラクター内の return ステートメントを通じて参照型の値が返される場合、新しい操作は最終的にこの参照型の値を返します。それ以外の場合は、新しく作成されたオブジェクトを返します。
• 参照型の値:​​ プリミティブ型の値 (数値、文字列、ブール値、null、未定義、シンボル値) を除くすべての値。

新しいオペレータのエミュレーション

次の myNew 関数は、new 演算子の動作をシミュレートします。

関数 myNew(func, ...args) {
  obj = {} とします
  obj.__proto__ = func.prototype
  res = func.apply(obj, args) とします。
  res インスタンスオブオブジェクトを返します? res : obj
}

関数Foo(num) {
  this.number = 数値
}

foo1 = myNew(Foo, 1) とします。
console.log(foo1 instanceof Foo) // true
console.log(foo1.number) // 1

foo2 = new Foo(2) とします。
console.log(foo2 instanceof Foo) // true
console.log(foo2.number) // 2

上記のinstanceof演算子は、コンストラクタの戻り値がObjectのインスタンスであるかどうか、つまり参照型の値であるかどうかを判断するために使用されます。これは、すべての参照型の値がObjectのインスタンスであり、Objectがすべての参照型値の基本型であるためです。

さて、JavaScript の new 演算子の原理に関するこの記事はこれで終わりです。JS の new 演算子の原理に関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。