js 中的继承
继承就是让一个对象拥有另一个对象的属性和方法
一、原型链继承(两种)
1、Son.prototype = Father.prototype （原型继承）
（1）Son的实例对象只能继承Father实例中原型的方法，无法继承Father本身的属性。
function Father(){ this.age = 50; this.h = 15 } Father.prototype.eat = function(){ console.log(this.age); // 25 console.log(this.h); // undefined } function Son(){ this.age = 25; } Son.prototype = Father.prototype; var son = new Son() son.eat() // son继承Father原型中的eat函数，所以this.age指向Son,故 25 // this.h 弹出undefined 说明无法继承Father本身的属性
2、Son.prototype = new Father() （实例化对象继承）
原理：就是把构造函数Father()的实例化对象father的属性和方法继承到构造函数Son()的原型上。修改的属性是实例化对象father的属性，每次实例化一个构造函数Son(),都是从father上继承，故属性相通。
（1）优先查找自身属性，如果有的话优先使用，如果没有则从继承中查找
（2）继承的构造函数的不同实例化对象的属性不会互相影响；不同的Son实例对象会共享继承Father的实例化对象father的属性。这样的话修改一个Son实例化对象son的arr，Son实例化对象son1的arr也会改变，修改被继承Fathe实例化对象father的属性时会影响继承者Son继承的属性
function Father(){ this.age = 50; this.arr = [1,2,3] this.h = 15; } Father.prototype.eat = function(){ console.log(this.age); console.log(this.h); } function Son(){ this.age = 25; } var father = new Father(); Son.prototype = father; var son = new Son(); son.eat(); // 25 说明当son优先查找自身属性 // 15 说明son继承Father实例对象的属性 son.arr.push(4) console.log(son.arr); // [1,2,3,4] console.log(father.arr) // [1,2,3] var son1 = new Son() console.log(son1.arr);// [1,2,3,4] 说明不同的Son实例对象会共享继承Father的实例化对象father的属性 father.arr.push(5) console.log(father.arr)// [1,2,3,5] console.log(son.arr);// [1,2,3,4,5] 说明修改被继承Fathe实例化对象father的属性时会影响继承者Son继承的属性
对于继承后 Son.prototype.constructor指向的问题，是否需要修改可以查看 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor
二、构造函数继承
在继承构造函数里通过call或者apply或bind修改被继承函数的this。
1、继承属性会覆盖自身属性，
2、继承的构造函数的不同实例化对象的属性不会互相影响
3、无法继承原型上的方法，
function Father(){ this.age = 50; this.hello = "你好"; this.arr = [1,2,3]; } Father.prototype.cat = function(){ console.log(cat); } function Son(){ // 三种方式 this.age = 25; Father.call(this); // Father.bind(this)(); // Father.apply(this); } var son = new Son(15) console.log(son.age); // 50 // 说明继承属性会覆盖自身属性 console.log(son.hello); // 你好 try{ son.cat() }catch(e){ console.log(e); // TypeError: son.cat is not a function } son.arr.push(4); console.log(son.arr); // [1,2,3,4] var son1 = new Son(25); console.log(son1.arr); // [1,2,3] // 这说明构造函数Son的不同实例化对象的属性是不相通，修改实例化对象
三、组合式继承 （原型链与构造函数）
在原型链继承中Son.prototype = Father.prototype只能继承Fanther的原型上的方法，在构造函数继承中，Fathe.call(this)只能继承构造函数的属性，两者结合。
1、继承属性会覆盖自身属性
2、继承的构造函数的不同实例化对象的属性不会互相影响
function Father(){
this.age = 50;
this.hello = "你好";
this.arr = [1,2,3];
};
Father.prototype.eat=function(){
console.log("这是Father构造函数原型上方法");
}
function Son(){
this.age = 25;
Father.call(this)
};
Son.prototype = Father.prototype;
var son = new Son();
console.log(son.age); // 50 说明继承的属性会覆盖自身的属性
console.log(son.hello); //你好
son.arr.push(4)
son.eat()
var son1 = new Son();
console.log(son.arr); //[1,2,3,4]
console.log(son1.arr); // [1,2,3]
// 说明同一构造函数的不同实例化对象之间属性不相通；
弊端：通过Father.call() 和Father.prototype ,父类构造函数Father被调用了两次。继承属性会覆盖原属性
四、原型式继承 （个人认为这种方式和原型链Son.prototype = new Father()的原理是一致的，各种表现也是一致）
1、优先查找自身属性，如果有的话优先使用，如果没有则从继承中查找
2、继承的构造函数的不同实例化对象的属性不会互相影响；
function Father(){ this.age = 50; this.hello = "你好"; this.arr = [1,2,3] }; Father.prototype.eat = function(){ console.log("这是Father原型上的方法"); } function content(obj){ function Son(){ this.age = 25; }; Son.prototype = obj; // 传入继承构造函数Father的实例化对象father return new Son(); } var father = new Father(); var son = content(father); console.log(son.hello); //你好 说明继承构造函数Father实例化对象father上的属性。 console.log(son.age); // 25 // 说明优先查找自身是否有某属性，有的话优先调用自身属性 son.eat() // 这是Father原型上的方法 说明继承了构造函数Father实例化对象father上的方法 son.arr.push(4) var son1 = content(father) console.log(son.arr); // [1,2,3,4] console.log(son1.arr); // [1,2,3,4] 说明这个不同实例间继承的属性是相通的
五、寄生式继承（在原型式继承的基础上，对Son实例化的外面添加函数封装而已，表现一致）
1、优先查找自身属性，如果有的话优先使用，如果没有则从继承中查找
2、继承的构造函数的不同实例化对象的属性不会互相影响；
function Father(){ this.age = 50; this.hello = "你好"; this.arr = [1,2,4]; }; Father.prototype.eat = function(){ console.log("这是Father构造函数原型上的方法"); } function content(obj){ function Son(){ this.age = 25; }; Son.prototype = obj; return new Son(); } function subObject(obj){ var son = content(obj) son.name = 'son 名字' // 可直接对son添加属性 return son } var father = new Father() var son1 = subObject(father) console.log(son1.age);//25 console.log(son1.hello);//你好 console.log(son1.name); // son 名字 son1.eat(); // 这是构造函数原型上的方法 son1.arr.push(4) var son2 = content(father) console.log(son1.arr); // [1,2,3,4] console.log(son2.arr); // [1,2,3,4] 说明这个不同实例间继承的属性是相通的
六、寄生组合式继承 （构造函数继承与寄生式继承组合）
1、寄生属性会覆盖原属性
2、继承的构造函数的不同实例化对象的属性不会互相影响
3、与组合式继承相比效果相同，但是更加复杂。
function Father(){ this.age = 50; this.hello = "你好"; this.arr = [1,2,3]; }; function content(obj){ function Son(){ this.age = 25; }; Son.prototype = obj; return new Son(); }; var son = content(Father.prototype) // var son = content(new Father()) 效果一致 function Sub(){ Father.call(this); // Father.apple(this); // Father.bind(this)(); }; Sub.prototype = son; son.constructor = Sub; var sub = new Sub(); console.log(sub.age); // 50 说明继承的属性会覆盖自身的属性 console.log(sub.hello); // 你好 sub.arr.push(4) console.log(sub.arr); // [1,2,3,4] var sub1 = new Sub(); console.log(sub1.arr); // [1,2,3] // 说明同一构造函数的不同实例化对象之间属性不相通；
七、Object.assign()
与组合式继承基本相同，除了Son.prototype = Object.create(Father.prototype),对原型继承的方式不一样
1、寄生属性会覆盖原属性
2、继承的构造函数的不同实例化对象的属性不会互相影响
// Father - 父类(superclass) function Father() { this.age = 50; this.arr = [1,2,3] } // 父类的方法 Father.prototype.move = function(x, y) { console.info('Father moved.'); }; // Son - 子类(subclass) function Son() { this.age = 25; Father.call(this); // call super constructor. } // 子类续承父类 Son.prototype = Object.create(Father.prototype); // Son.prototype.constructor = Son; var son = new Son(); console.log(son.age); // 50 说明继承属性覆盖原属性 son.move(); // Father moved son.arr.push(4) console.log(son.arr); // [1,2,3,4] var son1 = new Son(); console.log(son1.arr); // [1,2,3] // 说明不同实例之间数据不相通，可复用
