JavaScript類の継承操作例のまとめ

本論文の実例はJavaScript類の継承操作をまとめたものである.皆さんに参考にしてあげます.具体的には以下の通りです.
一、クラス継承
まずするのはコンストラクタを作ることです.慣例としては、名前はクラス名で、頭文字は大文字にするべきです.コンストラクタにおいて、インスタンス属性を作成するには、キーワードthisが必要である.クラスの方法は、prototypeオブジェクトに追加される.このクラスのインスタンスを作成するには、キーnewに関連してこのアーキテクチャ関数を呼び出すだけでよい.

/* Class Person. */
function Person(name) {
 this.name = name;
}
Person.prototype.getName = function() {
 return this.name;
}
var reader = new Person('John Smith');
reader.getName();

二、プロトタイプチェーン
JavaScriptの各オブジェクトには、prototypeという属性があります.この属性は他のオブジェクトを指すか、nullを指すか、対象のあるメンバーを訪問する時、このメンバーが現在のオブジェクトにいない場合、プロトタイプのオブジェクトを検索します.まだ見つかっていない場合は、プロトタイプチェーンに沿ってプロトタイプのオブジェクトを一つずつ訪問して、このメンバーを見つけるまでです.これは、1つのクラスを別のクラスに継承することを意味し、サブクラスのprototypeをスーパークラスの一例に設定すればよい.
AuthorがPersonを継承するためには、Authorのprototypeを手動でPersonの一例に設定しなければならない.最後のステップは、prototypeのconstruct属性をAuthorにリセットする(prototype属性がPersonに設定された例のため)場合、construct属性が消去される.

function Author(name, books) {
 Person.call(this, name); // Call the superclass' constructor in the scope of this.
 this.books = books; // Add an attribute to Author.
}
Author.prototype = new Person(); // Set up the prototype chain.
Author.prototype.constructor = Author; // Set the constructor attribute to Author.
Author.prototype.getBooks = function() { // Add a method to Author.
 return this.books;
};
var author = [];
author[0] = new Author('Dustin Diaz', ['JavaScript Design Patterns']);
author[1] = new Author('Ross Harmes', ['JavaScript Design Patterns']);
console.log(author[1].getName());
console.log(author[1].getBooks());

三、exted関数
クラスの声明を簡略化するために、子供たちを送るプロセス全体をextedという関数に包装することができます.その役割は他の言語のextendキーワードと類似しています.すなわち与えられたクラスの構造に基づいて新しいクラスを作成します.

function extend(subClass, superClass) {
 var F = function() {};
 F.prototype = superClass.prototype;
 subClass.prototype = new F();
 subClass.prototype.constructor = subClass;
}

実はやったことは前のと同じです.prototypeを先に設置してから、constructorを適切な値にリセットします.そして、中間的に空の関数を利用して、超クラスのインスタンスの作成を避けることができます.extendを使用して継承された書き方:

function Person(name) {
 this.name = name;
}
Person.prototype.getName = function() {
 return this.name;
}
/* Class Author. */
function Author(name, books) {
 Person.call(this, name);
 this.books = books;
}
extend(Author, Person);
Author.prototype.getBooks = function() {
 return this.books;
};

しかし、上記の問題の一つは、超種類のPersonの名称がAuthor類の声明に固化されていることです.もっと普遍的なやり方は次のようにするべきです.

/* Extend function, improved. */
function extend(subClass, superClass) {
 var F = function() {};
 F.prototype = superClass.prototype;
 subClass.prototype = new F();
 subClass.prototype.constructor = subClass;
 subClass.superclass = superClass.prototype;
 if(superClass.prototype.constructor == Object.prototype.constructor) {
  superClass.prototype.constructor = superClass;
 }
}
/* Class Author. */
function Author(name, books) {
 Author.superclass.constructor.call(this, name);
 this.books = books;
}
extend(Author, Person);
Author.prototype.getBooks = function() {
 return this.books;
};
Author.prototype.getName = function() {
 var name = Author.superclass.getName.call(this);
 return name + ', Author of ' + this.getBooks().join(', ');
};

このextendは改良された後、1つのsuperclassの属性を多くし、この属性はAuthorとPersonの結合を弱体化することができる.extendの後の3行は、超クラスのconstrutorが正しく設定されていることを確認するために使用される.superclassの属性があれば、直接スーパークラスのメソッドを呼び出すことができます.これは超種類のある方法を再定義したり、超種類での実現にアクセスしたいときに役立ちます.例えば、新しいgetNameの方法でPersonクラスの同名方法を再定義するために、Author.superclass.getNameで著者の名前を取得してから、新たな情報を追加しても良い.
四、原型継承
プロトタイプの継承はクラスの継承とは全く違っています.彼を勉強する時、自分のクラスや実例に関するすべての知識を忘れて、対象の角度から考えたほうがいいです.プロトタイプ継承を使用する場合は、クラスでオブジェクトを定義する必要はなく、ペアを直接作成すればいいです.このオブジェクトは次に新しいオブジェクトに使用され、そのオブジェクトはプロトタイプオブジェクトと呼ばれる.
上記のPersonとAuthorは、プロトタイプのオブジェクトを使用して再設計されます.

var Person = {
 name: 'default name',
 getName: function() {
  return this.name;
 }
};
var reader = clone(Person);
alert(reader.getName()); // This will output 'default name'.
reader.name = 'John Smith';
alert(reader.getName()); // This will now output 'John Smith'.

clone関数は、新しいクラスPersonオブジェクトを作成し、空のオブジェクトを作成し、オブジェクトのプロトタイプオブジェクトをpersonに設定するために使用されてもよい.新しいオブジェクトの中にある方法が見つからない場合は、元のオブジェクトの中で検索します.
Authorを作成するためにPersonサブクラスを定義する必要はありません.クローンを一回実行すればいいです.

var Author = clone(Person);
Author.books = []; // Default value.
Author.getBooks = function() {
 return this.books;
}

その後、クローン中の方法と属性を再定義することができます.Personのデフォルト値を変更できます.新しい属性と方法を追加することもできます.これにより、新しい原型オブジェクトが作成され、新しいAuthorオブジェクトを作成するために使用できます.

var author = [];
author[0] = clone(Author);
author[0].name = 'Dustin Diaz';
author[0].books = ['JavaScript Design Patterns'];
author[1] = clone(Author);
author[1].name = 'Ross Harmes';
author[1].books = ['JavaScript Design Patterns'];
author[1].getName();
author[1].getBooks();

clone関数の書き方:

function clone(object) {
  function F() {}
  F.prototype = object;
  return new F;
}

五、原型継承と類式継承の比較
自分で総括して、メモリから、適用範囲、長所と短所などの方面は分析に行きます.
六、元を混ぜる
コードを再利用する方法は厳密な継承を必要としないが、一つの関数を複数のクラスに適用するなら、拡張された方法でこれらのクラスを共有することができる.その実際の大体のやり方は、まず各種の共通の方法類を含んで、他の種類を拡充します.このような共通の方法類を含んで、「混元類」と呼びます.彼らは通常、実例化と直接に呼び出されません.その存在の目的は他の種類に自分の方法を提供することです.

var Mixin = function() {};
Mixin.prototype = {
 serialize: function() {
  var output = [];
  for(key in this) {
   output.push(key + ': ' + this[key]);
  }
  return output.join(', ');
 }
};
augment(Author, Mixin);
var author = new Author('Ross Harmes', ['JavaScript Design Patterns']);
var serializedString = author.serialize();
function augment(receivingClass, givingClass) {
 for(methodName in givingClass.prototype) {
  if(!receivingClass.prototype[methodName]) {
   receivingClass.prototype[methodName] = givingClass.prototype[methodName];
  }
 }
}

しかし、すべての方法が必要ではない場合がありますので、必要な方法を選択するために追加のパラメータを提供する必要があります.提供しないなら、全部コピーします.

function augment(receivingClass, givingClass) {
 if(arguments[2]) { // Only give certain methods.
  for(var i = 2, len = arguments.length; i < len; i++) {
   receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];
  }
 }
 else { // Give all methods.
  for(methodName in givingClass.prototype) {
   if(!receivingClass.prototype[methodName]) {
    receivingClass.prototype[methodName] = givingClass.prototype[methodName];
   }
  }
 }
}

更にJavaScriptに関する内容については、当駅のテーマを見ることができます.「javascript対象入門教程」、「JavaScriptエラーとデバッグテクニックのまとめ」、「JavaScriptデータ構造とアルゴリズム技法のまとめ」、「JavaScript巡回アルゴリズムと技術のまとめ」及び「JavaScript数学演算の使い方のまとめ」
本論文で述べたように、JavaScriptプログラムの設計に役に立ちます.