[js高手之路]構造函數的基本特性與優缺點

上文,通過基本的對象創建問題了解了構造函數，本文，我們接着上文繼續了解構造函數的基本特性，以及優缺點.

每個對象上面都有一個constructor屬性( 嚴格意義上來說，是原型上的，對象是通過查找到原型找到 constructor屬性 ).后面講到原型的時候，我會用示意圖的方式說明

        function CreateObj(uName) {
            this.userName = uName;
            this.showUserName = function () {
                return this.userName;
            }
        }
        var obj1 = new CreateObj('ghostwu');
        var obj2 = new CreateObj('衛庄');
        console.log( obj1.constructor === CreateObj ); //true
        console.log( obj2.constructor === CreateObj ); //true

默認情況下，對象的constructor等於實例化對象的構造函數, constructor最初的作用是用來標識對象的，但是並不是特別准確，因為constructor能被修改,

識別對象一般用instanceof關鍵字.

什么是instanceof？

要理解這個關鍵字，需要搞清楚原型鏈，這里，我提前把他放出來

//假設instanceof運算符左邊是L，右邊是R
L instanceof R 
//instanceof運算時，通過判斷L的原型鏈上是否存在R.prototype
L.__proto__.__proto__ ..... === R.prototype ？
//如果存在返回true 否則返回false

注意：instanceof運算時會遞歸查找L的原型鏈，即L.__proto__.__proto__.__proto__.__proto__...直到找到了或者找到頂層為止。

所以一句話理解instanceof的運算規則為：

instanceof檢測左側的__proto__原型鏈上，是否存在右側的prototype原型。

        console.log( obj1 instanceof Object ); //true
        console.log( obj2 instanceof Object ); //true
        console.log( obj1 instanceof CreateObj ); //true
        console.log( obj2 instanceof CreateObj ); //true

obj1,obj2之所以是Object的實例，因為所有對象繼承自Object

借用構造函數

一個空對象，可以借用現有的構造函數，完成屬性和方法的復制

        function CreateObj(uName) {
            this.userName = uName;
            this.showUserName = function () {
                return this.userName;
            }
        }
        var obj = new Object();
        CreateObj.call( obj, 'ghostwu' );
        console.log( obj.userName ); //ghostwu
        console.log( obj.showUserName() ); //ghostwu

構造函數的優點與缺點

優點就是能夠通過instanceof識別對象，缺點是每次實例化一個對象，都會把屬性和方法復制一遍

        var obj1 = new CreateObj('ghostwu');
        var obj2 = new CreateObj('衛庄');

        console.log( obj1.showUserName === obj2.showUserName ); //false

從以上執行結果，可以看出obj1.showUserName和obj.showUserName不是同一個【在js中，引用類型比較的是地址, 函數是一種引用類型】，而是存在兩個不同
的內存地址，因為每個對象的屬性是不一樣的，這個沒有什么問題，但是方法執行的都是一樣的代碼，所以沒有必要復制，存在多份，浪費內存.這就是缺點

怎么解決構造函數的方法復制多次的問題？

        function CreateObj(uName) {
            this.userName = uName;
            this.showUserName = showUserName;
        }
        function showUserName (){
            return this.userName;
        }
        var obj1 = new CreateObj('ghostwu');
        var obj2 = new CreateObj('衛庄');
        console.log( obj1.showUserName === obj2.showUserName ); //true

把對象的方法指向同一個全局函數showUserName, 雖然解決了多次復制問題，但是全局函數非常容易被覆蓋，也就是大家經常說的污染全局變量.

比較好的解決方案？

通過原型(prototype)對象，把方法寫在構造函數的原型對象上

        function CreateObj(uName) {
            this.userName = uName;
        }
        CreateObj.prototype.showUserName = function(){
            return this.userName;
        }
        var obj1 = new CreateObj('ghostwu');
        var obj2 = new CreateObj('衛庄');
        console.log( obj1.showUserName === obj2.showUserName ); //true

什么是原型對象，以及原型鏈？且聽下回分解