天天看點

JavaScript繼承

  很久之前就看了有關JavaScript繼承,都沒怎麼總結,剛好今天有空就來聊聊呗 (^o^)/

  通過不斷試驗 來檢驗自己了解的正确性。

  首先JavaScript裡面所有的資料類型都是對象(object),其中的new指令引入Javascript,用來從原型對象生成一個執行個體對象。

  (這裡請注意:在JavaScript中,new指令後面跟的是構造函數)

  1、new運算符

  用構造函數生成執行個體對象,有一個缺點,那就是無法共享屬性和方法。

  舉個栗子:在Man對象的構造函數中,設定一個執行個體對象的共有屬性species。

  然後,我生成兩個執行個體對象

  這兩個對象的species屬性是獨立的,修改其中一個,不會影響到另一個

  這說明,每一個執行個體對象,都有自己的屬性和方法的副本,他們之間不僅無法做到資料共享,而且對資源造成浪費

   2、prototype屬性

  構造函數有一個prototype屬性,這個屬性包含一個對象(以下簡稱"prototype對象"),

  所有執行個體對象需要共享的屬性和方法,都放在prototype對象裡面,

  那些不需要共享的屬性和方法,就放在構造函數裡面。

  再舉個栗子:以Man構造函數為例,現在用prototype屬性進行改寫

JavaScript繼承
JavaScript繼承

  因為 species屬性放在prototype對象裡,是兩個執行個體對象共享的。是以隻要我修改了prototype對象,就會同時影響到兩個執行個體對象

    3、構造函數的繼承

  現在有一個"人類"對象的構造函數

  還有一個"男人"對象的構造函數

  怎樣才能使"男人"繼承"人類"呢?

  (1)構造函數綁定

    使用apply方法,将父對象的構造函數綁定在子對象上

    就想舉栗子:在子對象構造函數中加一行

JavaScript繼承
JavaScript繼承

 

   (2)prototype模式

    使用prototype屬性,如果"男人"的prototype對象,指向一個Human執行個體,那麼所有"男人"的執行個體,就能繼承Human了

    栗子如下:我将Man的prototype對象指向一個Human的執行個體

   注意:任何一個prototype對象都有一個constructor屬性,指向它的構造函數。

        是以我才将Man.prototype對象的constructor值改為Man,即 把這個屬性指回原來的構造函數

  4、非構造函數繼承

  現在有一個"人類"的對象

  還有一個"男人"的對象

  (1)object()方法

    使用object()函數,把子對象的prototype屬性,指向父對象,進而使得子對象與父對象連在一起

    又來栗子:首先我會寫出object()函數

    使用的時候,先在父對象的基礎上,生成子對象,然後再加上子對象本身的屬性

    可以看出,子對象已經繼承了父對象的屬性了。

    未完待續》》

繼續閱讀