7

javascript の mixin パターンについて読んでいるときに、理解できない次のコードに遭遇しました。

SuperHero.prototype = Object.create( Person.prototype );

実際には、元のコード (大文字の H) にタイプミスがあります。ダウンケースすると機能します。ただし、実際に行を削除すると、すべてが同じように機能するようです。

完全なコードは次のとおりです。

var Person =  function( firstName , lastName ){
  this.firstName = firstName;
  this.lastName =  lastName;
  this.gender = "male";
};

// a new instance of Person can then easily be created as follows:
var clark = new Person( "Clark" , "Kent" );

// Define a subclass constructor for for "Superhero":
var Superhero = function( firstName, lastName , powers ){

    // Invoke the superclass constructor on the new object
    // then use .call() to invoke the constructor as a method of
    // the object to be initialized.

    Person.call( this, firstName, lastName );

    // Finally, store their powers, a new array of traits not found in a normal "Person"
    this.powers = powers;
};

SuperHero.prototype = Object.create( Person.prototype );
var superman = new Superhero( "Clark" ,"Kent" , ["flight","heat-vision"] );
console.log( superman ); 

// Outputs Person attributes as well as powers

何をしSuperHero.prototype = Object.create( Person.prototype );ますか?

4

3 に答える 3

4

Personコンストラクターのプロトタイプオブジェクトから継承する新しいオブジェクトを作成します。

あなたがこれをしたかのようになります。

SuperHero.prototype = new Person();

Personコンストラクターで実際にコードを呼び出さずにインスタンスを作成することを除いてPerson

このオブジェクトはSuperHeroコンストラクターのプロトタイプオブジェクトとして使用されるため、インスタンスを作成すると、のすべてのプロトタイププロパティと、プロトタイプオブジェクトに直接追加されSuperHeroたプロトタイププロパティが継承されます。PersonSuperHero

于 2012-09-11T17:58:53.330 に答える
1

これは、ドキュメントの状態とまったく同じように機能します。

指定されたプロトタイプオブジェクトとプロパティを使用して新しいオブジェクトを作成します。

このproto場合はPerson

パラメータは次のように記述します。

新しく作成されたオブジェクトのプロトタイプであるはずのオブジェクト。

コードObject.create( Person.prototype );は、人のプロパティ(この場合はfirstName、lastName、gender)をコピーして、それらをSuperHeroに割り当てるオブジェクトを返します。

Personaとaの類似点に注意してください。SuperHeroどちらにもafirstNameとaが含まれていlastNameます。違いにも注意してください。にはプロパティがPerson含まれてgenderいますが、にはプロパティSuperHeroが含まれていpowersます。

于 2012-09-11T17:58:22.000 に答える
1
SuperHero.prototype = Object.create( Person.prototype );

これは基本的にSuperHeroのすべてのプロパティ/プロトタイプを継承させていますPerson。を使用するのとほぼ同じですnewが、新しい ECMAScript 5 *Object.create()` の方法です。理解に役立つのであれば、このように書くこともできます。

SuperHero.prototype = new Person();

2 つのプロトタイプが絡み合っていることを意味するため、プロトタイプを具体的にリンクするのは好きではありません。一方をサブクラス、もう一方をスーパークラスにすることを好みます。

それらを自分で確認する良い方法は、このようなことをすることです. SuperHeroここでは、 から取得されている継承を実際に確認できますPerson。すべてのプロパティ (first/last/etc) があり、追加の Powers であることに注意してください。

jsFiddle デモ

var person = new Person();
SuperHero.prototype = person; // inheritance here
// the Object.create way is ECMAScript 5 (which not all browsers support yet sadly)

var superman = new SuperHero( "Clark" ,"Kent" , ["flight","heat-vision"] );
console.log( person );
console.log( superman ); ​
于 2012-09-11T18:03:28.557 に答える