JavaScript物件導向-- 3種建立新物件的方法

之前有提到如何使用new建立新物件, 它屬於是3種建立新物件中的"自訂建構式函式"方法。


第1種: 實字物件建立方法 -- 透過實字符號模式(literal notation patterns)快速建立新物件。
適合建立單個物件。

    e.g.
 
    var cat = {};
    cat.name = "kitty";
    cat.getName = function() {

        return this.name;

    };

    可將上面這麼寫:
 
    var cat = {
        name: "kitty",
        getName: function() {

            return this.name;

        }
    };


第2種: 內建建構式函式 -- 透過內建的建構式(constructor functions)建立新物件。
適合建立單個物件, 且當傳入不同參數會有意想不到的結果(等等解釋), 所以不如就直接使用實字物件建立法吧。

    e.g.

    var cat = new Object();
    cat.name = "kitty";
    cat.getName = function() {

        return this.name;

    };


第3種: 自訂建構式函式 -- 透過自訂建構式函式建立新物件。(也就是物件導向的寫法)
適合建立同一類型多個物件。記得用原型來建立、新增相同方法喔! 而每個物件屬性值本就不同, 因而建立在類別中剛剛好。

    e.g.

    function Cat() {
this.name = "kitty";
this.getName = function() {

return this.name;

};
    }

    var cat = new Cat();


p.s. 關於constructor:

在JavaScript中, 因為沒有類別, 所以沒有constructor這方法在其中。但是JavaScript以function解決這個問題, 也因此我們不用特別標記出constructor method。因為constructor總在new出一個建構式的那時刻就被建立好, 裡面定義了一個function的初始化的特性/值/方法。

(注意: ES6有constructor, 但仍屬於prototype-based; ES6的Class被稱是"裹著糖果的糖衣", 仍屬於prototype-based)


最後, 可以來討論第2種方法的問題了:
在動態建立物件情況下, 會使新物件指向別的資料型態的原型, 明明原本都是Object的資料型態:

    e.g.
 
    var o = new Object(1);
    console.log(o.constructor === Number);              // true

    var p = new Object("harry");
    console.log(p.constructor === String);                 // true

    var q = new Object(true);
    console.log(q.constructor === Boolean);             // true

以上新產生的實體指向的constructor因為傳入的參數關係, 都變了。

接著, 分別檢查各個實體的__proto__看看是不是也不一樣了, 畢竟透過__proto__會指向當初建立實體的類別的prototype(而原型中有constructor):

o.__proto__ === Number.prototype                          // true
p.__proto__ === String.prototype                             // true
q.__proto__ === Boolean.prototype                         // true

上述可知, __proto__已不指向一開始的Object.prototype了, 也因此連帶地其constructor也不再是function Object() 了。