JavaScript中的私有/靜態屬性介紹_javascript技巧

•模擬區塊級作用域
大家都知道在JavaScript中沒有區塊級作用域的概念，我們可以透過使用閉包來模擬實現區塊級作用域，看下面的範例：

複製程式碼 程式碼如下:

(function () {
for (var i = 0; i for (var i = 0; i //Do Nothing
}
alert(i); //輸出10
})();

第6行可以存取for循環區塊中的變數i，如果我們稍微修改以上程式碼，把for循環區塊放置在閉包中，情況就不一樣了：

複製程式碼

程式碼如下:

(function () {
(function () {
for (var i = 0; i //Do Nothing
}
})();
alert(i); //Error: 'i' is undefined
})();

在第8行存取變了i時，出現錯誤，實現了我們想要的區塊級作用域。
•私有屬性
在JavaScript中沒有區塊級作用域的概念，同樣也沒有私有屬性的概念，但是存在私有變數。如果我們想把一些資料封裝隱藏起來要怎麼做呢？想必大家可能已經想到了，可以透過使用閉包 私有變數的方式來實現物件的私有屬性。
.實例私有屬性
實例私有屬性的特性就是每個物件都會包含獨立的屬性，物件和物件之間沒有共用。為了實現這個目標，可以在建構函數中增加一個私有變量，然後定義公共方法來存取這個私有變量，就如同其他OO語言的setter和getter一樣，下列範例就實現了實例的私有屬性：

複製程式碼

程式碼如下:

//實例私有變數
function MyObject(>
//實例私有變數
function MyObject( >//定義私有變數
//注意：此處沒有用this.name，如果使用this.name變成公有屬性了
var privateName = name;
//定義私有熟悉
var privateFunction = function () {
return "Private Function";
}
//公共方法訪問私有熟悉
MyObject.prototype.getName = function () {
return privateName;
}
MyObject.prototype.getFunction = function () {
return privateFunction();
}
}
var moGyy = new MyObject("gyy"); (moGyy.getName()); //輸出gyy
alert(moGyy.getFunction()); //輸出Private Function
var moCyy = new MyObject("cyy");
alert(moCyy. getName()); //輸出cyy
alert(moCyy.getFunction()); //輸出Private Function

在上面的範例中建立的兩個物件moGyy和moCyy的getName傳回不同的值，同時如果想呼叫私有方法同樣也需要公共介面。上面的範例中兩個公用函數之所以能存取私有變量，是因為兩個公用函數都是閉包，而閉包的作用域鏈中包含了包含函數的變數對象，因此在進行變數查找時，順著作用域鏈可以存取包含函數中的私有變數。在上面的範例中把公共方法加入MyObject的原型中，目的是防止每次創建物件都創建具有相同功能的兩個函數實例。
.靜態私有屬性
在有些情況下我們可能希望資料全域共享，那麼可能就會用到靜態屬性，我們還是希望這個屬性為私有的，那麼怎麼實作靜態私有屬性呢？首先這個私有應該在建構函式的外部，為了把建構子外部的變數和建構子結合為一體，可以使用閉包把私有變數和建構函式都包含在其作用域中，為了在閉包外面存取內部的建構函數，可以使用一個全域的變數來引用建構函數，如下程式碼範例：

複製程式碼

程式碼如下:

//靜態私有變數與實例私有變數
(function () {
//定義私有變數
var staticPrivateValue = "";
//建構函數，把構織函數賦值給一個全域的變數
MyObject = function (name) {
//定義實例變數
this.name = name;
};
//定義兩個公用方法用於訪問私有變量，再一次把公共方法添加到原型中
MyObject.prototype.getPrivateValue = function () {
return staticPrivateValue;
}
MyObject.prototype.setPrivateValue = function (value ) {
staticPrivateValue = value;
}
})();
var mo = new MyObject("jeff-gyy");
mo.setPrivateValue("gyycyy"); / /設定私有屬性的值
alert(mo.getPrivateValue()); //輸出gyycyy
alert(mo.name); //輸出jeff-gyy
var mo1 = new MyObject("jeff- cyy");
alert(mo1.getPrivateValue()); //輸出gyycyy
alert(mo1.name); //輸出jeff-cyy

從上面的程式碼來看mo1呼叫getPrivateValue函數傳回的值就是mo設定的值"gyycyy"，為什麼會這樣呢？首先我們定義了一個匿名函數並立即呼叫函數，函數包含了私有變數staticPrivateValue，那麼為MyObject定義的兩個原型方法其實透過閉包的作用域鏈可以存取在包含函數的私有變量，也就是getPrivateValue和setPrivateValue兩個函數的作用域鏈中都包含了匿名函數的變數對象，我們知道作用域鏈中包含的變數物件其實就是一個指針，所以創建的兩個物件透過公共方法房屋私有變數時，其實存取的都是匿名函數的變數物件中的staticPrivateValue，因此實現變數實例間共享的目的。從傳統OO語言的角度來看我們實現的靜態屬性其實並不是真正意義上的靜態，只是實作了靜態屬性實例共享的特性。
.模組模式和增強模組模式
還有一種全域共享資料的方式就是singleton，可以使用模組模式來實現Object類型的單例模式，也可以使用增強模組模式實現自訂類型的單例模式，如下範例：

複製程式碼 程式碼如下:

//自訂建構子
var mo = new function () {
//私有變數
var privateValue = "";
//普通模組模式
return {
publicValue: "public" ,
//存取私有變數
getPrivateValue: function () {
return privateValue;
},
setPrivateValue: function (value) {
privateValue = value>
}
}();
mo.setPrivateValue("private value");
alert(mo.getPrivateValue());
alert(mo.publicFunction());

模組模式使用匿名函數來封裝內部實現，就上面的示例匿名函數中包含了私有變量privateValue，返回的對像中的公共函數通過閉包的作用域鏈訪問包含函數中的私有變量，由於定義的匿名函數被立即調用，因此變量mo引用的是返回的對象。上面的單例模式回傳的是一個Object對象，可以使用增強模組模式實作自訂類型的單例模式：

複製程式碼 程式碼如下:

//增強模組模式
//自訂建構子
function MyObject(name) {
this.name = name;
} ;
//自訂建構子
var mo = new function () {
//私有變數
var privateValue = "";
//增強模組模式
var o = new MyObject("gyycyy");
o.publicValue = "public";
//存取私有變數
o.getPrivateValue = function () {
return privateValue; 🎜>o.setPrivateValue = function (value) {
privateValue = value;
}
return o;
}();
mo.setPrivateValue("private value")
alert(mo.getPrivateValue());
alert(mo.publicFunction());


以上程式碼範例實作了MyObject的單例模式。
最後需要提一點的是使用閉包有利也有弊，由於閉包作用域鏈引用包含函數的變量對象，因此會佔用額外的內存，而且進行變量查找是也需要通過作用域鏈，因此會消耗查找時間，閉包越深情況更嚴重。另外在IE(早年版本)中由於垃圾回收機制使用引用計數，因此可能會出現循環引用的情況，導致內存洩露，如下示例：

複製程式碼 程式碼如下: function assignHandler(){

var element = document.getElementById("someElement");

){
alert(element.id);
};
}


在上面的程式碼中創建了一個閉包作為element的事件，該閉包引用了包含函數assingHandler的變數對象，而恰恰是對變數對象的引用使得element引用計數至少為1，因此element不會被回收，導致內存外洩。修改的方法大家可以想想。