繼承是什么？

• 課本的介紹：子類可以繼承父類的方法和屬性,然后在這個基礎(chǔ)上進行添加方法和屬性?？梢蕴岣叽a的復(fù)用性和效率。
• 我的理解：繼承就是可以少些很多代碼。我們可以把之前的實現(xiàn)的方法和屬性，拿過來然后給新的對象用。
• 遺憾的是，js并沒有天生的繼承機制。所以要我們自己來實現(xiàn)。怎么實現(xiàn)？請往下看。
• 前面的文章講解了一些基礎(chǔ)知識。建議看看。:)
  怎么創(chuàng)建的對象詳細介紹

廢話說多了不好，直接看例子

  function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    var p1= new Person('zhaobw',23);
    p1.run();

先在我們已經(jīng)有一個構(gòu)造函數(shù)Person了。這個構(gòu)造函數(shù)還有個方法run()
現(xiàn)在我們需要創(chuàng)建個新的構(gòu)造函數(shù)Student。這個構(gòu)造函數(shù)有屬性name、age方法run().還有一個新的屬性ID。我們該怎么寫？

   function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    var p1= new Person('zhaobw',23);
    p1.run();
   function Student(name,age,id){
        this.name = name;
        this.age = age;
        this.id = id;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    var p1= new Person('zhaobw',23,20134540);
    p1.run();

對比一下student和Person。兩個函數(shù)只有一點點的不同。但是卻寫了好多的代碼。是不是很浪費。

現(xiàn)在我們用繼承來實現(xiàn)。

  function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    function Student(name,age,id){
        Person.call(this,name,age);
        this.id = id;
    }
    Student.prototype = copy(Person.prototype);
    function copy(oldObj){
        var obj = new Object();
        obj.__proto__ = oldObj;
        return obj;
    };
    var s1 = new Student('z','23',12);
    s1.run();//I can run!!

結(jié)果證明Student繼承了Person

其他的寫法：

1

  function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    function Student(name,age,id){
        Person.call(this,name,age);
        this.id = id;
    }
    Student.prototype = Object.create(Person.prototype);//這里發(fā)生了變化
    var s1 = new Student('z','23',12);
    s1.run();//I can run!!

2

   function Person(name,age){
        this.name = name;
        this.age = age;
    }
    Person.prototype.run = function(){
        console.log("I can run!!");
    }
    function Student(name,age,id){
        Person.call(this,name,age);
        this.id = id;
    }
    Student.prototype = copy(Person.prototype);
    function copy(oldObj){
        var newObj = function(){};
        newObj.prototype = oldObj;
        return new newObj();
    }
    var s1 = new Student('z','23',12);
    s1.run();

寫了這么多了。發(fā)現(xiàn)了規(guī)律了么？

• 首先通過call來獲得父類的屬性。
• 創(chuàng)建一個空對象，然后這個空對象的proto指向父類的prototype。
• 子類的prototype的指向上面創(chuàng)建的空對象。

前面說了一堆的廢話。然后寫了一堆代碼?？偨Y(jié)出來了上面的三句話。好好的理解。

知識拓展

為了更好的理解繼承，我多寫一點點額外的拓展。

• instanceof 運算符用來測試一個對象在其原型鏈中是否存在一個構(gòu)造函數(shù)的 prototype 屬性。這個方法可以用來檢測對象的父類是誰。
  當然我們也可以自己封裝實現(xiàn)：

  function _instanceof(obj,fn){
  var sign = obj.__proto__;
  while(sign){
    if(sign == fn.prototype){
          return true;
      }else{
          sign = sign.__proto__; 
      }
    }
  return false;
  }
  

• hasOwnProperty是Object.prototype的一個方法
  判斷一個對象是否包含自定義屬性和方法，而不是原型鏈上的屬性和方法