js继承的6种方法
1.原型链继承
JavaScript实现继承的基本思想:通过原型将一个引用类型继承另一个引用类型的属性和方法。
实例:
function Test(){ this.name='alan'; } Test.prototype.demo = function(){//----增加demo方法 return 'test'; } function TestDemo(){} TestDemo.prototype = new Test();//----将Test实例赋给TestDemo的原型对象 var a = new TestDemo(); a.name; //------->alan a.demo(); //------->test TestDemo的实例能访问到Test对象的实例方法,也能访问到其原型属性中的方法。
2.借用构造函数继承(伪造对象或经典继承)
JavaScript实现继承的基本思想:在子类构造函数内部调用超类型构造函数。
通过使用apply()和call()方法可以在新创建的子类对象上执行构造函数。
实例:
function Test(){ this.names=['alan','tony','lucy'] } function TestDemo(){ Test.apply(this);//---->继承了Test } var a = new TestDemo(); a.names.push('alice'); console.log(a.names);//---->alan,tony,lucy,alice var b = new TestDemo(); console.log(b.names);//---->alan,tony,lucy
3.组合继承(原型+借用构造)(伪经典继承)
JavaScript实现继承的基本思想:将原型链和借用构造函数的技术组合在一块,从而发挥两者之长的一种继承模式。
将原型链和借用构造函数的技术组合到一起,从而取长补短发挥两者长处的一种继承模式。
实例:
function Test(name){ this.colors = ['red','blue','black']; this.name = name; } Test.prototype.HiName = function(){ console.log(this.name); } function TestDemo(){ Test.call(this,name);//---->属性继承 } //---->继承方法 TestDemo.prototype = new Test(); TestDemo.prototype.constructor = TestDemo; TestDemo.prototype.HiAge = function() { console.log(this.age); } var a = new TestDemo('alan',18); a.colors.push('green'); consol.log(a.colors);//---->red,blue,black,green a.HiName();//---->alan a.HiAge();//---->18 var b = new TestDemo('alan6',20); console.log(b.colors);//---->red,blue,black b.HiName();//---->alan6 b.HiAge();//---->20
4.原型式继承
JavaScript实现继承的基本思想:借助原型可以基于已有的对象创建新对象,同时还不必须因此创建自定义的类型。
实例:
var Test = { name:'alan', colors:['red',blue,'black']; } var aTest = object(Test); aTest.name = 'lucy'; aTest.colors.push('green'); var bTest = object(Test); bTest.name = 'tony'; bTest.colors.push('grey'); console.log(Test.colors);//---->red,blue,black,green,grey
5.寄生式继承
JavaScript实现继承的基本思想:创建一个仅用于封装继承过程的函数,该函数在内部以某种方式来增强对象,最后再像真正是它做了所有工作一样返回对象。
寄生式继承是原型式继承的加强版。
实例:
function Test(orig){ var clone = object(orig); clone.a = function(){ console.log('alan'); } return clone; } var TestDemo = { name = 'lucy'; colors:['red','blue','black']; } var abc = Test(TestDemo); abc.a;//---->alan
6.寄生组合式继承
JavaScript实现继承的基本思想:通过借用函数来继承属性,通过原型链的混成形式来继承方法。
基本模型:
function inheritProperty(subType, superType) { var prototype = object(superType.prototype);//---->创建对象 prototype.constructor = subType;//---->增强对象 subType.prototype = prototype;//---->指定对象 }
实例:
function Test(name){ this.name = name; this.colors = ['red','blue','black']; } Test.prototype.sayName = function (){ alert(this.name); }; function TestDome(name,age){ Test.call(this,name); this.age = age; } inheritProperty(Test,TestDome); TestDome.prototype.sayAge = function() { console.log(this.age); }
———————————— 方向错了,停下来就是进步 ————————————