继承的几种方法
继承：一个没有某个方法的对象使用具有这个方法的对象的方法
对象之间的继承，类之间的继承
对象继承：
改变this的指向
1 // var obj = { 2 // name:"admin", 3 // show:function(){console.log(this.name)} 4 // } 5 // var obj2 = {name:"root"} 6 // obj.show() 7 // obj.show.call(obj2); 8 // obj.show.apply(obj2); 9 // obj.show.bind(obj2)();
new关键字
1 // function Fn(){ 2 // this.name = "admin"; 3 // } 4 // Fn.prototype.show = function(){ 5 // console.log(this.name) 6 // } 7 // var f = new Fn(); 8 // f.show();
构造函数与构造函数之间的继承
1.继承-改变this的指向（构造函数继承）
只能继承构造函数中的内容，不能继承原型上的方法
简单，方便
可以轻松实现多继承
1 function Parent(n){ 2 this.name = n; 3 this.show = function(){ 4 console.log(this.name); 5 } 6 } 7 Parent.prototype.init = function(){ 8 console.log("hello") 9 } 10 11 12 function Parent2(){ 13 this.abc = function(){ 14 console.log("abc"); 15 } 16 } 17 function Parent3(){ 18 this.qwe = function(){ 19 console.log("qwe"); 20 } 21 } 22 23 24 function Child(n){ 25 Parent.call(this,n); 26 Parent2.call(this); 27 Parent3.call(this); 28 // Parent.apply(this,[n]); 29 // Parent.bind(this,n)(); 30 } 31 32 33 var p = new Parent("html"); 34 var c = new Child("div"); 35 36 37 p.show(); 38 p.init(); 39 c.show(); 40 // c.init(); 41 c.abc(); 42 c.qwe();
2.原型继承：原型对象继承，原型链继承
原型对象继承
只能继承原型对象上的方法或属性，不能继承构造函数中的方法或属性
1.没有兼容问题
2.不方便传参
1 function Parent(n){} 2 Parent.prototype.name = "html"; 3 Parent.prototype.show = function(){ 4 console.log(this.name); 5 } 6 Parent.prototype.abc = function(){ 7 console.log("abc"); 8 } 9 10 11 function Child(n){} 12 13 14 // Child.prototype = Parent.prototype; 15 for(var i in Parent.prototype){ 16 Child.prototype[i] = Parent.prototype[i]; 17 } 18 19 20 Child.prototype.abc = function(){ 21 console.log("hello"); 22 } 23 24 25 var p = new Parent(); 26 var c = new Child(); 27 28 29 p.show(); 30 c.show(); 31 p.abc(); 32 c.abc();
原型链继承
既能继承构造函数，又能继承原型
不方便传参
1 function Parent(n){ 2 this.name = n; 3 } 4 Parent.prototype.show = function(){ 5 console.log(this.name); 6 } 7 8 9 function Child(){} 10 11 12 Child.prototype = new Parent("div"); 13 14 15 // Child.prototype.show = function(){ 16 // console.log("hello"); 17 // } 18 19 20 var p = new Parent("html"); 21 var c = new Child(); 22 23 24 console.log(p); 25 console.log(c); 26 27 28 p.show(); 29 c.show();
混合继承：构造函数继承 + 原型对象（链）继承
既能继承构造函数，又能继承原型，还方便传参
常用继承方法之一
1 function Parent(n){ 2 this.name = n; 3 } 4 Parent.prototype.show = function(){ 5 console.log(this.name); 6 } 7 8 9 function Child(n){ 10 Parent.call(this,n); 11 } 12 for(var i in Parent.prototype){ 13 Child.prototype[i] = Parent.prototype[i]; 14 } 15 Child.prototype.show = function(){ 16 console.log("hello"); 17 } 18 19 20 var p = new Parent("html"); 21 var c = new Child("div"); 22 23 24 console.log(p); 25 console.log(c); 26 27 28 p.show(); 29 c.show();
ES6-class继承，在语法层面上实现的继承方式，好用，方便，简单
有兼容
构造函数+原型链继承
class Parent{ constructor(n){ this.name = n; } show(){ console.log(this.name); } } class Child extends Parent{ constructor(n){ super(n); } } var p = new Parent("html"); p.show(); var c = new Child("div"); c.show(); console.log(p) console.log(c)
