ホームページ > 記事 > ウェブフロントエンド > js聖杯パターン解説
Holy Grail パターンは、既存のプロトタイプ オブジェクト (A.prototype) のメンバー (主にパブリック メソッド) を継承し、同時にプロトタイプ オブジェクト (A.prototype) を独自のニーズに応じて変更してコンストラクター B をカスタマイズするために存在します。要件を満たしている場合、この変更は既存のインスタンス (a1、a2、...) には影響しません。
var Person = function () {}; Person.prototype.sayHello = function () { console.log('hello'); };// 假设 person 原型属性上有很多方法和变量我们需要拿来使用,比如: spell这个方法我们要拿来继续使用Person.prototype.spell = function () { console.log('i can spell!'); };var personA = new Person();var personB = new Person();var personC = new Person();var personD = new Person();var personE = new Person();var personF = new Person();var personG = new Person();var personH = new Person(); personA.sayHello(); personA.spell(); personB.sayHello(); personB.spell();// ...// 之前应项目需求 实例化了很多对象, 现在需要 实例化 n 个说中文的对象,同时要具备之前的 spell相同能力 Person.prototype.sayHello = function () { console.log('你好'); };var chinaPersonA = new Person();var chinaPersonB = new Person();var chinaPersonC = new Person();var chinaPersonD = new Person();var chinaPersonE = new Person(); chinaPersonA.sayHello(); chinaPersonA.spell(); chinaPersonB.sayHello(); chinaPersonB.spell();// ...// 之前的对象还能说英文 hello 吗? 显然不能了personA.sayHello(); // 你好personA.spell(); personB.sayHello(); // 你好personB.spell();// 显然我们对已存在的原型对象修改,对别人使用的的或者说以前构建的对象产生了影响
var Person = function () {} Person.prototype.sayHello = function () { console.log('hello'); }; Person.prototype.spell = function () { console.log('i can spell!'); };var personA = new Person();var personB = new Person(); personA.sayHello(); personA.spell();var grailMode = (function () { return function (Origin, Target) { var Temp = function () {};// 临时构造函数 Temp.prototype = Origin.prototype; Target.prototype = new Temp(); // 这里不是明白,为什么要加个临时构造函数 Target.prototype.constructor = Target; // 目标构造函数原型属性constructor指向 目标构造函数 Target.prototype.ancestor = Origin; // target 的生父 } })();// 我们定制的构造函数var ChinaPerson = function () {} grailMode(Person, ChinaPerson); ChinaPerson.prototype.sayHello = function () { console.log('你好'); }var ChinaPersonA = new ChinaPerson(); ChinaPersonA.sayHello(); ChinaPersonA.spell(); personA.sayHello(); personA.spell();
聖杯パターンは、既存のコンストラクター (Factory) を通じてインスタンス オブジェクト (P) を構築し、次にコンストラクター ( C )、このコンストラクター (C) のプロトタイプ属性がこのインスタンス オブジェクト (P) (一時コンストラクターのインスタンス オブジェクト) を指すようにします。これにより、カスタマイズされたコンストラクター (C) のプロトタイプ属性を変更するとき、唯一のことは変更されるのは、インスタンス オブジェクト (P) 内の単なる属性メンバーです。プロトタイプ チェーン アクセスの原則は、まず現在のオブジェクトにメンバーが存在するかどうかを調べ、存在しない場合は直接アクセスします。そのプロトタイプオブジェクト...プロトタイプ チェーンを通過しない場合は、未定義が返されます。
インスタンスはプロトタイプ オブジェクトの属性メンバーにアクセスできますが、プロトタイプ オブジェクトのメンバーを
変更することはできません。 Instance.member は、現在のインスタンスに属性メンバーを追加して値を割り当てることと同等です。以上がjs聖杯パターン解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。