JavaScript のプロトタイプチェーンメカニズムの詳細な分析-jsチュートリアル-php.cn

JavaScript のプロトタイプチェーンメカニズムの詳細な分析

JS のプロトタイププロトタイプチェーンの詳細説明

JavaScript では、各オブジェクトにはプロトタイプ (プロトタイプ) があり、プロトタイプとは、共有プロパティとメソッドを含むオブジェクトです。プロトタイプチェーンは、オブジェクトがプロパティとメソッドを継承および共有できるようにするメカニズムです。

プロトタイプチェーンは、オブジェクトのプロトタイプを指す各オブジェクトの _proto_ 属性を通じて実装されます。オブジェクトが必要なプロパティまたはメソッドを見つけられない場合、オブジェクトはプロトタイプチェーンを見つけるか、プロトタイプチェーンの最後に到達するまで、プロトタイプチェーンに沿って続行します。

パーソンというコンストラクターとそのインスタンスオブジェクトを作成する例を見てみましょう:

function Person(name, age) { this.name = name; this.age = age; } var person1 = new Person('Alice', 25);

ログイン後にコピー

new 演算子を使用して person1 オブジェクトを作成する場合、次の操作が実行されます:

空のオブジェクト person1 を作成します。
person1 の _proto_ 属性を Person コンストラクターのプロトタイプ (person.prototype) にポイントします。
パーソンコンストラクターを実行し、これを person1 にポイントし、名前と年齢の属性を割り当てます。

実際、person.prototype は person1 のプロトタイプです。プロトタイプにメソッドと属性を追加できます:

Person.prototype.sayHello = function() { console.log('Hello, my name is ' + this.name); };

ログイン後にコピー

これで、person1 オブジェクトは SayHello メソッドを使用できるようになります:

person1.sayHello(); // 输出: Hello, my name is Alice

ログイン後にコピー

person1.sayHello() メソッドを呼び出すと、JavaScript はまず person1 オブジェクト内でこのメソッドを検索します。見つからない場合は、引き続き Person.prototype 内のプロトタイプチェーンに沿って検索し、実行します。それを見つけてからです。

新しい属性を Person.prototype に追加すると、person1 もそれを使用できます:

Person.prototype.gender = 'Female'; console.log(person1.gender); // 输出: Female

ログイン後にコピー

プロトタイプチェーンは継承も実装でき、新しいコンストラクター Student を作成して継承させることができます。 from Person:

function Student(name, age, school) { Person.call(this, name, age); this.school = school; } Student.prototype = Object.create(Person.prototype); Student.prototype.constructor = Student;

ログイン後にコピー

上記のコードでは、Object.create() メソッドを使用して Student.prototype オブジェクトを作成し、その _proto_ 属性を Person.prototype にポイントし、Student.prototype .constructor ポイントを設定します。 Student コンストラクターに。

ここで、student1 オブジェクトを作成し、 Person から継承したプロパティとメソッドを使用できます。

var student1 = new Student('Bob', 20, 'ABC School'); console.log(student1.name); // 输出: Bob console.log(student1.age); // 输出: 20 student1.sayHello(); // 输出: Hello, my name is Bob console.log(student1.school); // 输出: ABC School

ログイン後にコピー

上記の例では、student1 オブジェクトは、 Person から継承したプロパティとメソッドにアクセスできます。その理由は、プロトタイプチェーンを通じてこれらのプロパティとメソッドを見つけることができるためです。

プロトタイプチェーンは、オブジェクトの継承と共有プロパティとメソッドを実装するための Javascript の重要なメカニズムであり、コードをより効率的かつ柔軟にします。 JavaScript コードを記述するときは、プロトタイプチェーンを深く理解することが非常に重要です。

概要: