js 原型鏈實現類的繼承

學上星辰發表於2020-11-08

## 什麼是原型鏈?

每個物件都可以有一個原型_proto_,這個原型還可以有它自己的原型,以此類推,形成一個原型鏈。查詢特定屬性的時候,我們先去這個物件裡去找, 如果沒有的話就去它的原型物件裡面去,如果還是沒有的話再去向原型物件的原型物件裡去尋找… 這個操作被委託在整個原型鏈上, 這個就是我們說的原型鏈了。

原型指標

prototype屬性,它是函式所獨有的,它是從一個函式指向一個物件。
它的含義是函式的原型物件,也就是這個函式(其實所有函式都可以作為建構函式)所建立的例項的原型物件; 這個屬性是一個指標,指向一個物件,這個物件的用途就是包含所有例項共享的屬性和方法(我們把這個物件叫做原型物件);
–proto-- 是原型鏈查詢中實際用到的,它總是指向 prototype,
換句話說就是指向建構函式的原型物件,它是物件獨有的。
## es5通過建構函式

 //通過建構函式建立父類
    function father(name) {
      // 物件屬性 
        this.name = name; 
    }
     //父類的原型方法
     father.prototype.getName=function(name){
      return '我的名字叫:' + this.name;
     }
     //子類
  
     function Child(name){
       father.call(this,name)
     }
    Child.prototype=new father();
    
    var z = new Child("學上星辰3");
    console.log(z.getName(name));

es6 通過class方法

//通過class方法建立父類
class point2{ 
      constructor(name,age){
        this.name=name ;
        this.age=age;
      }  
    }
    //建立子類並繼承父類
    class sexpoint2 extends point2{
      constructor(name,age,sex){
        // 在子型別建構函式中通過super呼叫父型別的建構函式
        super(name,age);
        this.sex=sex
      }
      //建構函式上的原型方法
      toSex(){
        return "名字:"+this.name+" 年齡:"+this.age+" 性別:"+this.sex
      }
    }
    let sext=new sexpoint2("學上星辰4",18,"男")
    console.log(sext.toSex());  
    console.log(sext.name);
    console.log(sext.age);
    console.log(sext.sex)

相關文章