JavaScriptの原型
2273 ワード
コンストラクタの作成対象に関する問題
前の記事では、JavaScriptのオブジェクト作成のいくつかの方法を紹介しましたが、それぞれの長所と短所があります.コンストラクタはよさそうに見えますが、それらはまた一つの問題があります.それは作成された各インスタンスオブジェクトの方法は独立した関数です.たとえ彼らの内容が全く同じであっても、関数のコード多重原則に合わないし、作成されたインスタンスを統一的に修正する方法もありません.
JavaScriptプロトタイプ解決案
JavaScriptでは、一つのオブジェクト(関数も対象)を定義するたびに、オブジェクトの中に予め定義されている属性が含まれます.各
この原型の対象は何の役割がありますか?構造関数は
上のコードはこのように書き換えられます.
プロトタイプオブジェクト内の方法は相互に呼び出すことができます.
前の記事では、JavaScriptのオブジェクト作成のいくつかの方法を紹介しましたが、それぞれの長所と短所があります.コンストラクタはよさそうに見えますが、それらはまた一つの問題があります.それは作成された各インスタンスオブジェクトの方法は独立した関数です.たとえ彼らの内容が全く同じであっても、関数のコード多重原則に合わないし、作成されたインスタンスを統一的に修正する方法もありません.
function Person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
this.introduce = function () {
console.log(" " + this.name + ", " + this.age + " .");
};
}
var jerry = new Person("Jerry", "21", "M");
var julia = new Person("Julia", "27", "F");
console.log(jerry.introduce === julia.introduce); // false
上記のコードの中のjerryオブジェクトとjurliaオブジェクトのintroduce()
方法は2つの独立した関数であり、データは共有されず、オブジェクトがより多く作成されるとメモリ空間が無駄になります.JavaScriptプロトタイプ解決案
JavaScriptでは、一つのオブジェクト(関数も対象)を定義するたびに、オブジェクトの中に予め定義されている属性が含まれます.各
にはプロトタイプ属性があり、この属性は関数のプロトタイプオブジェクトを指す.この原型の対象は何の役割がありますか?構造関数は
ですから、プロトタイプの属性があります.プロトタイプのオブジェクトがあります.これがオブジェクトである以上、属性と方法を長く追加することができます.このプロトタイプオブジェクトはこのコンストラクタの属性として作成されたすべてのインスタンスで共有されています.上のコードはこのように書き換えられます.
function Person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
Person.prototype.introduce = function () {
console.log(" " + this.name + ", " + this.age + " .");
};
var jerry = new Person("Jerry", "21", "M");
var julia = new Person("Julia", "27", "F");
console.log(jerry.introduce === julia.introduce); // true
このようにデータ共有の問題を解決し、コード多重化の目的を達成しました.このコンストラクタを通していくつかのオブジェクトを作成したに関わらず、introduce方法はメモリ空間を占有するだけです.また、すべてのPerson構成関数によって作成された例示的なオブジェクトのintroduce方法を統一的に修正することができる.プロトタイプオブジェクト内の方法は相互に呼び出すことができます.
function Dog(name, age) {
this.name = name;
this.age = age;
}
Dog.prototype.play = function () {
console.log(" ");
this.bark();
};
Dog.prototype.bark = function () {
console.log(" ");
};
var tom = new Dog("Tom", 3);
tom.play();//