Javascript原型（二）

圖解原型

function Person() {//TODO}
var p = new Person();

代碼執行以前要經歷一個預解析的過程。function Person(){}是函數聲明，p 也是聲明（p 沒有畫出來），聲明在預解析的時候完成。

• 內存狀況

  

因此，在代碼開始運行時，構造函數 Person 在內存中已經存在了，因此代碼運行起來第一句話是要執行var p = new Person();
程序開始執行

• 執行 new 建立對象
• 執行構造函數 Person 初始化對象（給對象添加屬性)
• 內存狀況

  

• 賦值給變量 p

  

• 針對構造函數來講，Person類型對象是構造函數的實例對象
• 針對構造函數來講，神祕對象是構造函數的原型屬性
• 針對Person類型對象來講，神祕對象是Person類型對象的原型對象

  

/* 接上面的代碼 */
Person.prototype.good = function() {console.log("好");}
p.good(); //好

p表示的對象默認鏈接到Person.prototype，Person類型對象中是不存在good方法的，可是p也能夠訪問到good方法，因而可知，噹噹前對象中不存在某屬性或方法時，會去神祕對象中去查找。因此能夠說，當前對象（Person類型對象）繼承自神祕對象；也能夠說，當前的實例對象，繼承自其原型對象，這就是原型繼承。

• 原型繼承

  

爲何使用原型

• 爲何屬性通常不放在原型上

  • 屬性表示對象的特徵，是一種對象特有的東西，對象不同，屬性也應該不同。但若是放到原型上，那麼就會被全部對象共享

• 爲何方法能夠放在原型上

  • 屬性是對象特有的，可是這個對象的行爲應該是同樣的。好比人和人是不同的，可是人都會走路，吃飯，這就是行爲，每一個人都是同樣的，因此能夠將其放在原型中複用

• 如何修改原型
  一、 利用對象的動態特性

  Student.prototype.sleep = function(){}

  2 、利用直接替換

  /* 構造函數.prototype.xxxx = vvvv */
  /* 直接將原型進行了替換 */
  Student.prototype = {
      sleep: function(){}
      study: function(){}
  }

• 第一種方式與第二種方式最大的不一樣是，第二種方式又建立出了一個對象，將原有的原型對象進行了替換，因此如今內存中又兩個對象；第一種作法是直接在原來的對象上添加屬性

分析如下題目

function Person() {}

Person.prototype.func = function () {
    console.log("11111");
};

var p1 = new Person();

Person.prototype = {
    func: function () {
        console.log("2222");
    }
};

var p2 = new Person();
p1.func();
p2.func();

• 預解析構造函數

  

• 構造函數原型屬性賦值

  

• var p1 = new Person();

  

• 原型屬性從新賦值，首先執行等號右邊的語句，也就是在內存中建立了一個對象

  

• var p2 = new Person();
• 此時構造函數的原型屬性已經指向了匿名對象，因此新建立的Person類型的對象的原型對象也指向匿名對象

  

• 從圖能夠得知，p1.func() 執行結果是1111；p2.func() 執行結果是 2222

• 總結：只要對象建立出來了，即便原型屬性被從新賦值，那麼也不會影響已經建立好的對象的功能