ホームページ > 記事 > ウェブフロントエンド > JavaScriptプロトタイプパターンの使用例を詳しく解説_JavaScriptスキル
この記事の例では、JavaScript プロトタイプ モードの使用法について説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。
一般に、ファクトリ パターンとコンストラクター パターンの欠点を理解すると、プロトタイプ パターンが必要な理由がわかります
プロトタイプ パターン i の定義: すべての関数にはプロトタイプ属性があります。プロトタイプ属性は、特定の型のすべてのインスタンスで共有できるプロパティとメソッドを含めることを目的としたオブジェクトです。たとえば、コンストラクター モデルのsayInformation() メソッドでは、2 つのインスタンスが宣言されている場合、sayInformation メソッドを 2 回構築する必要がありますが、2 回宣言する必要はないのが、このプロトタイプ パターンが表示される理由です (Nima、これらのブログ)。インターネット上ではすべてが「ナンセンスですか?それとも本を読むと分かりやすいですか?」)、sayInformation()をプロトタイプモードとして宣言した後、インスタンスは共有され、2回宣言する必要はありません
function Person(){} Person.prototype.name="jack"; Person.prototype.age=10; Person.prototype.sayInformation=function() { console.log("my name is"+this.name+" age is"+this.age); } var person1 = new Person(); person1.sayInformation(); console.info(person1.name); //来自原型的属性name person1.name="Greg"; //修改实例的name属性 console.info(person1.name); //来自实例的属性name delete person1.name ; //来自实例的属性,这里删除的是实例的属性,但是原型的属性依然存在 console.info(person1.name); //来自原型的属性name var person2 = new Person(); person2.sayInformation(); console.info(person1.hasOwnProperty("name")); //hasOwnProperty检查属性是属于实例还是原型中,如果是实例中就返回true console.info(person1.name==person2.name); console.info(person1.sayInformation==person2.sayInformation); console.info(person1.constructor); //指向person1的构造函数 //原型更加简便的写法 function Person2(){} Person2.prototype={ name:"jack", age:29, sayInformationfunction:function() { console.log("my name is"+this.name+" age is"+this.age); } }
この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。