メモリの分類
- プロトタイプ連鎖継承＋借用コンストラクタ＝組合せ継承＋寄生継承＝寄生組合せ継承
- プロトタイプ継承
- ES6
I. プロトタイプチェーンの継承
//プロトタイプ連鎖継承
//
// 属性名を所有する
function parents(){
this.name = "JoseyDong";
}
// 親クラスのプロトタイプオブジェクトにgetNameメソッドを追加する
parents.prototype.getName = function(){
console.log(this.name);
}
//
function child(){
}
//サブクラスのプロトタイプ・オブジェクトは、親クラスのインスタンス・オブジェクトを指す。
child.prototype = new parents()
// 親クラスの属性とメソッドを持つサブクラスのインスタンスを作成することは、継承が実装されていることを証明する。
let child1 = new child();
child1.getName(); // => JoseyDong
コンストラクターの借用
// コンストラクタ継承
function parents(){
this.name = ["JoseyDong"];
}
// 呼び出しメソッドコンストラクタを使ったサブクラスでの継承
function child(){
parents.call(this);
}
let child1 = new child();
let child2 = new child();
child1.name.push("xixi");
let child3 = new child();
console.log(child1.name);// => ["JoseyDong", "xixi"]
console.log(child2.name);// => ["JoseyDong"]
console.log(child3.name);// => ["JoseyDong"]
組み合わせ継承
//組み合わせ継承
function student(name){
this.name = name;
this.hobbies = ["sing","dance","rap"];
}
function greatStudent(name,age){
student.call(this,name);
this.age = age;
}
greatStudent.prototype = new student();
greatStudent.prototype.constructor = greatStudent;
let kunkun = new greatStudent('kunkun','18');
let fakekun = new greatStudent('fakekun','28');
console.log(kunkun.name,kunkun.age,kunkun.hobbies) // => kunkun 18 ["sing", "dance", "rap"]
console.log(fakekun.name,fakekun.age,fakekun.hobbies) // => fakekunkun 28 ["sing", "dance", "rap"]
kunkun.hobbies.push("basketball");
console.log(kunkun.name,kunkun.age,kunkun.hobbies) // => kunkun 18 ["sing", "dance", "rap", "basketball"]
console.log(fakekun.name,fakekun.age,fakekun.hobbies)// => fakekun 28 ["sing", "dance", "rap"]
let heima = new greatStudent('heima','20')
console.log(heima.name,heima.age,heima.hobbies) // => heima 20 ["sing", "dance", "rap"]
プロトタイプ継承
// プロトタイプ継承
function createObj(o){
function F(){};
F.prototype = o;
return new F();
}
let person = {
name:'JoseyDong',
hobbies:['sing','dance','rap']
}
let person1 = createObj(person);
let person2 = createObj(person);
console.log(person1.name,person1.hobbies) // => JoseyDong ["sing", "dance", "rap"]
console.log(person2.name,person2.hobbies) // => JoseyDong ["sing", "dance", "rap"]
person1.name = "xixi";
person1.hobbies.push("basketball");
console.log(person1.name,person1.hobbies) //xixi ["sing", "dance", "rap", "basketball"]
console.log(person2.name,person2.hobbies) //JoseyDong ["sing", "dance", "rap", "basketball"]
寄生継承
//寄生継承
function createObj(o){
let clone = Object.create(o);
clone.sayName = function(){
console.log('hi');
}
return clone
}
let person = {
name:"JoseyDong",
hobbies:["sing","dance","rap"]
}
let anotherPerson = createObj(person);
anotherPerson.sayName(); // => hi
VI.寄生的組み合わせ遺伝
// 寄生的組み合わせ継承
function student(name){
this.name = name;
this.hobbies = ["sing","dance","rap"];
}
function greatStudent(name,age){
student.call(this,name);
this.age = age;
}
//継承を実装するための3つの重要なステップ
// null関数をサブクラスとその親の仲介役として使う目的は、サブクラスのプロトタイプ・オブジェクトの変更が親のプロトタイプ・オブジェクトに影響するのを防ぐためである。
let F = function(){};
F.prototype = student.prototype;
greatStudent.prototype = new F();
let kunkun = new greatStudent('kunkun','18');
console.log(kunkun);
最後に、この継承メソッドをカプセル化します：
function object(o) {
function F() {}
F.prototype = o;
return new F();
}
function prototype(child, parent) {
let prototype = object(parent.prototype);
prototype.constructor = child;
child.prototype = prototype;
}
// いつ使うか
prototype(Child, Parent);
ES6の継承
// ES6
class parents {
constructor(){
this.grandmather = 'rose';
this.grandfather = 'jack';
}
}
class children extends parents{
constructor(mather,father){
//super キーワードは、この場合は親クラスのコンストラクタを表し、親クラスの新しい thisオブジェクトを生成するために使われる。
super();
this.mather = mather;
this.father = father;
}
}
let child = new children('mama','baba');
console.log(child) // =>
// father: "baba"
// grandfather: "jack"
// grandmather: "rose"
// mather: "mama"
