JS里的繼承

1. 繼承

  1. 簡(jiǎn)介
    一層原型鏈搜索不叫繼承,兩層原型鏈的搜索才叫繼承

    let a = new Array();
    a.__proto__ === Array.prototype
    a.push()  
    //這個(gè)方法是Array.prototype的,不是繼承
    
    a.__proto__.__proto__ === Object.prototype
    a.valueOf()  
    //這個(gè)方法是Object.prototype里的,是繼承
    

    a.valueOf()這個(gè)方法就叫繼承的

  2. 實(shí)現(xiàn)

  • ES5的繼承
    function Human(name){
      this.name = name;
    }
    Human.prototype.run = function(){
      console.log("我叫" + this.name + "我在跑步")
      return
    }
    
    function Man(name){
      Human.call(this,name);  
      //引用Humnan的自身的屬性屬性
      this.gender = '男'
    }
    Man.prototype.fight = function(){
      console.log('打架')
    }
    Man.prototype.__proto__ = Human.prototype
    //將Man的原型的原型指向Human.prototype
    let pyz = new Man('pyz')
    
    這樣pyz.run就是繼承屬性,因?yàn)榻?jīng)過(guò)了兩層原型鏈的搜索。
    兼容IE,Man.prototype.__proto__ = Human.prototype這句IE不支持,可以寫(xiě)成下面這樣
    let f = function(){}
    f.prototype = Human.prototype
    Man.prototype = new f();
    
  • ES6
    class Human{
      constructor(name){
        this.name = name
      }
      run(){
        console.log('我叫' + this.name + '我在跑步')  
        return
      }
    }
    
    class Man extends Human{  //繼承Human的原型鏈
      constructor(name){
        super(name)  //用它繼承的類里的name
        this.gender = '男'
      }
      fight(){}
    }
    
  1. ES5、ES6的優(yōu)劣
    用ES6在原型聲明非函數(shù)的方法很奇怪。。。
    ES5可以Human.prototype.race = '人類'
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • JS中原型鏈,說(shuō)簡(jiǎn)單也簡(jiǎn)單。 首先明確: 函數(shù)(Function)才有prototype屬性,對(duì)象(除Object...
    前小白閱讀 3,962評(píng)論 0 9
  • 工廠模式類似于現(xiàn)實(shí)生活中的工廠可以產(chǎn)生大量相似的商品,去做同樣的事情,實(shí)現(xiàn)同樣的效果;這時(shí)候需要使用工廠模式。簡(jiǎn)單...
    舟漁行舟閱讀 7,852評(píng)論 2 17
  • 繼承6種套餐 參照紅皮書(shū),JS繼承一共6種 1.原型鏈繼承 核心思想:子類的原型指向父類的一個(gè)實(shí)例 Son.pro...
    燈不梨喵閱讀 3,174評(píng)論 1 2
  • 如何控制alert中的換行?\n alert(“p\np”); 請(qǐng)編寫(xiě)一個(gè)JavaScript函數(shù) parseQu...
    heyunqiang99閱讀 1,101評(píng)論 0 6
  • avaScript對(duì)每個(gè)創(chuàng)建的對(duì)象都會(huì)設(shè)置一個(gè)原型,指向它的原型對(duì)象。 當(dāng)我們用obj.xxx訪問(wèn)一個(gè)對(duì)象的屬性時(shí)...
    源大俠閱讀 269評(píng)論 0 1