论坛首页 Web前端技术论坛

JavaScript 对象实现继承的几种方式

浏览 3712 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-05-26   最后修改:2010-05-13
先定义一个对象classA,我们要实现一个新对象,继承classA
function classA(sColor){
   this.color=sColor;
   this.sayColor=function(){
     alert(this.color);
   }
}


1. 用call方法实现继承
function classC(sColor,sName){
   classA.call(this,sColor);
   this.name=sName;
   this.sayName=function(){
     alert(this.name);
   }
}

var obj1=new classC("red","jack");

obj1.sayColor();
obj1.sayName();



2.用apply方法实现继承,
  这种方法的本质和call方法是一致的,不同的是APPLY的第个参数是数组(包含了要传递的所有参数)
function classD(sColor,sName){
  classA.apply(this,new Array(sColor));
  this.name=sName;
  this.sayName=function(){
    alert(this.name);
  }
}

var obj2=new classD("blue","sherry");
obj2.sayColor();
obj2.sayName();


3. 原型方法, 请参考我的前篇文章
   JAVASCRIPT定义对象的四种方式

4. 构造函数,原型混合方法
function classA(sName){
  this.name=sName;
}

classA.prototype.sayName=function(){
  alert(this.name);
}

function classB(sName,sHeight){
   classA.call(this,sName)
   this.height=sHeight;
}

classB.prototype=new classA();

classB.prototype.sayHeight=function(){
   alert(this.height);
}

var obj3=new classA("jack");

obj3.sayName();

var obj4=new classB("shrry",27);

obj4.sayName();

obj4.sayHeight();



5. 使用类似于Prototype extend 方法
  
    function extend(childclass,superclass){
      var func=function(){};
      func.prototype=superclass.prototype;
      childclass.prototype=new func();
      childclass.prototype.constructor=childclass;
    }
   
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics