JavaScript繼承與多繼承實(shí)例講解

這篇文章主要介紹“JavaScript繼承與多繼承實(shí)例講解”，在日常操作中，相信很多人在JavaScript繼承與多繼承實(shí)例講解問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”JavaScript繼承與多繼承實(shí)例講解”的疑惑有所幫助！接下來，請跟著小編一起來學(xué)習(xí)吧！

本文實(shí)例講述了JavaScript繼承與多繼承。分享給大家供大家參考，具體如下：

雖然最新的EC6里邊已經(jīng)有了class的相關(guān)功能，但是從普及度上和閱讀舊代碼需求的方面來看，這點(diǎn)知識也得了解一下。

本文結(jié)構(gòu)：

① 原理及分析

② 簡單封裝后的運(yùn)用

1. 繼承

① 原理及分析

先上一張圖：

用這段代碼的思想來實(shí)現(xiàn)繼承，即：

var inherit=function(objBase){
    var F=function(){}; //第一步：定義一個函數(shù)F
    F.prototype=objBase; //第二步：將傳進(jìn)來的基類對象(objBase)賦給函數(shù)F的原型(F.prototype)
    return new F(); //第三步：返回一個F對象(已經(jīng)具備了objBase特征)
}

② 簡單封裝后的運(yùn)用

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. 多繼承

① 原理及分析

多繼承就是將多個對象的成員，交給當(dāng)前對象

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);

② 簡單封裝后的運(yùn)用

Function.prototype.inherits=function(){
    var arr=arguments; //將接收到的arguments對象傳給數(shù)組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);

到此，關(guān)于“JavaScript繼承與多繼承實(shí)例講解”的學(xué)習(xí)就結(jié)束了，希望能夠解決大家的疑惑。理論與實(shí)踐的搭配能更好的幫助大家學(xué)習(xí)，快去試試吧！若想繼續(xù)學(xué)習(xí)更多相關(guān)知識，請繼續(xù)關(guān)注億速云網(wǎng)站，小編會繼續(xù)努力為大家?guī)砀鄬?shí)用的文章！