首頁  >  文章  >  web前端  >  如何使用JS繼承與多重繼承

如何使用JS繼承與多重繼承

php中世界最好的语言
php中世界最好的语言原創
2018-05-28 09:52:281098瀏覽

這次帶給大家如何使用JS繼承與多繼承,使用JS繼承與多繼承的注意事項有哪些,下面就是實戰案例,一起來看一下。

雖然最新的EC6裡邊已經有了class的相關功能,但是從普及度上和閱讀舊程式碼需求的方面來看,這點知識也得了解一下。

本文結構:

① 原理與分析

② 簡單封裝後的運用

1. 繼承

① 原理及分析

先上一張圖:

用這段程式碼的想法來實現繼承,即:

var inherit=function(objBase){
    var F=function(){}; //第一步:定义一个函数F
    F.prototype=objBase; //第二步:将传进来的基类对象(objBase)赋给函数F的原型(F.prototype)
    return new F(); //第三步:返回一个F对象(已经具备了objBase特征)
}

② 簡單封裝後的運用

Function.prototype.inherit=function(objBase){
    this.prototype=new objBase();
}
var Person=function(){
    this.name="倩倩";
    this.sex="女";
}
var Student=function(){
    this.id="0712";
}
Student.inherit(Person);
var student=new Student();
alert(student.name +","+ student.sex +","+ student.id);

#2. 多重繼承

###① 原理與分析#########多繼承就是將多個物件的成員,交給目前物件###
var o1={name:"倩倩"} //对象的字面值
var o2={sex:"女"}
var She=function(){}
She.prototype={};  //先声明
for(var k in o1){
    She.prototype[k]=o1[k];
}
for(var k in o2){
    She.prototype[k]=o2[k];
}
var she=new She();
alert(she.name + "," + she.sex);
######② 簡單封裝後的運用######
Function.prototype.inherits=function(){
    var arr=arguments; //将接收到的arguments对象传给数组arr
    this.prototype={};
    for(var i=0;i<arr.length;i++){
      for(var k in arr[i]){
        var obj=arr[i];
        this.prototype[k]=obj[k];
      }
    }
}
var o1={name:"倩倩"} //对象的字面值
var o2={sex:"女"}
var She=function(){}
She.inherits(o1,o2);
var she=new She();
alert(she.name + "," + she.sex);
###相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章! ######推薦閱讀:#########如何讓JS陣列與JSON物件動態實作新增、修改、刪除###############怎麼使用JS繼承與多繼承#########

以上是如何使用JS繼承與多重繼承的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn