javascript原型继承-实现extjs底层继承（2）

对于传统的继承方式，会存在一定的缺点，分析extjs底层的实现可以解决产生的问题

<script type="text/javascript">
//这里使用之前说过得混合继承的方式
function Person(name, age) {
    this.name = name;
    this.age = age;
}

Person.prototype = {
    id: 10,
    sayName: function() {
        alert(this.name);
    }
};

function Boy(name, age, sex) {
    //call绑定父类的模板函数(只复制了父类的模板)
    Person.call(this, name, age);
    this.sex = sex;
}

//原型继承的方式，既继承了父类的模板（只是相当于没有传入相应的参数），又继承了父类的原型对象(之前说过的原型对象和模板构造函数都会产生关联)
 Boy.prototype = new Person();
 var boy = new Boy('z3', 18, '男');
 boy.sayName();
 alert(boy.id);
 </script>

这里存在一个缺点，父类的模板函数被调用了两次，如果对象非常多的话，毫无疑问会造成性能的损耗，因此可以进行以下改进。

<script type="text/javascript">
 //这里使用之前说过得混合继承的方式
 function Person(name, age) {
     this.name = name;
     this.age = age;
 }

 Person.prototype = {
     constructor: Person, //①
     sayName: function() {
         alert(this.name);
     }
 };

 function Boy(name, age, sex) {
     //call绑定父类的模板函数(只复制了父类的模板)
     Boy.superClass.constructor.call(this, name, age);  //②  在子类中不再出现父类的信息，做到一定的解耦
     this.sex = sex;
 }

 //自定义extend方法仅仅让原型继承一次
 // Boy.prototype = new Person();
 extend(Boy, Person);

 function extend(sub, sup) {
     //让子类只继承1次父类的原型对象
     var F = new Function();
     //通过一个临时变量只接受父类的原型对象
     F.prototype = sup.prototype;
     //正常的继承
     sub.prototype = new F();
     //此时需要还原sub的构造函数
     sub.prototype.constructor = sub;
     //保存一下父类的原型对象，一方面方便解耦，另一方面方便活得父类的原型对象  见②处代码
     sub.superClass = sup.prototype;
     //为了确保父类的构造函数被处理过，可以加上一个保险  见①出的代码
     if (sup.prototype.constructor == Object.prototype.constructor) {
         //手动欢迎父类原型对象的构造器
         sup.prototype.constructor = sup;
     }

 }

 var boy = new Boy('z3', 18, '男');
 alert(Boy.superClass.constructor); //如果忽略①出的构造函数处理，结果会出现错误
 boy.sayName();  //z3
 </script>