深入 JavaScript(4) - new運算符是如何工作的


接着上篇(//www.cnblogs.com/patrick-holynova/archive/2013/05/14/3077295.html), 來談談在OOP中重要的new運算.

JavaScript 不像高級語言C++, Java等本身就提供了對類的支持, 那么在Js中如何實現類, 類的實例?

  1. 對象字面量
  2. 用構造器創建

對象字面量, 例:

Detail = {
    'game': 'World of Warcraft',
    'class':  'Priest',
    'spell':   'Holy Nova'
}

 這種方式沒什么好說的, 重點談談通過構造器創建實例.

什么是構造器? 前幾篇已經說過很多遍了, 我們還可以叫它構造函數(下文開始都叫它構造函數了, 因為: ). 那么它自然是一個函數. 並且這個構造函數還帶有一個名字是

prototype的屬性, 這個屬性指向的對象, 用於初始化實例的__proto__, 也就是說新的實例們繼承了這個對象!

當然, 一個構造器還必須很多內部方法, 比如[[Construct]], 暫且不談

構造函數須要通過 new 表達式來創建新對象. 如果不使用new, 則結果依賴於具體的構造函數的寫法.

比如:

d1  = Date();    // "Mon May 20 2013 10:10:38 GMT+0800 (China Standard Time)"
// typeof d1 == 'string' , 產生了一個字符串, 不是一個'對象'.

d2 = new Date();    // typeof d2 == 'object' , d2為一個對象

 每個由構造函數創建的對象, 都有一個隱式引用到構造函數的原型對象.

d2.__proto__ === Date.prototype;    // true
Object.getPrototypeOf(d) === Date.prototype;    // true

 ------------

new 運算是如何工作的呢?

我們先假設有這樣一個構造函數:

var WOWCharacter = function(cName) {
    var level = 0;
    
    this.name = cName;

    this.getLevel = function() { return this. level; }
    this.setLevel = function(lv) { this.level = lv; return this.getLevel(); }  
}

 現在創建一個角色, 創建一個類的實例:

var subsidiaryCharacter = new WOWCharacter('巫喵王');
// 現在subsidiaryCharater對象是這樣的
{
    name: '巫喵王',
    getLevel: function(){...},
    setLevel: function(){...}
}

 你可能會問, level 屬性哪兒去了? 其實它是一個'私有變量', 是不能直接訪問的, 這個我最在文章最后介紹一點, 不是本篇重點.

new 的執行過程

  1. 創建一個新的對象, obj = new Object();
  2. 調用 WOWCharacter 構造函數: 傳入參數(如果有的話), 本例中為 ('巫喵王'), 並且令構造函數中的 this 為 創建的新對象 obj
  3. 如果構造函數返回了一個對象, 那么最終的新實例為這個對象(本例中, 構造函數無返回值, 通常也是這么做的, 不讓其有返回值.)
    如果構造函數沒有返回一個對象, 那么就讓第1步中創建的對象 obj 為最終的返回值. subsidiaryCharacter = obj.

-- over --

new運算聊完了, 上面提到私有變量的問題, level 就是一個私有的變量, 只能通過'特權函數' getLevel, setLevel訪問.

直接 subsidiaryCharacter.level 是取不到值的, 為什么? 閉包

下次談談Js中的閉包吧.


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM