物件導向的Javascript之三(封裝和資訊隱藏)

同時，我們知道在物件導向的進階語言中，建立包含私人成員的對象是最基本的特性之一，提供屬性和方法對私人成員進行訪問來隱藏內部的細節。雖然JS也是物件導向的，但沒有內部機制可以直接表明一個成員是公有還是私人的。還是那句話，依靠JS的語言靈活性，我們可以建立公用、私人和特權成員，資訊隱藏是我們要實現的目標，而封裝是我們實現這個目標的方法。我們還是從一個樣本來說明：建立一個類來儲存圖書資料，並實現可以在網頁中顯示這些資料。

1. 最簡單的是完全暴露對象。使用建構函式建立一個類，其中所有的屬性和方法在外部都是可以訪問的。 複製代碼 代碼如下:var Book = function(isbn, title, author) {
if(isbn == undefined) {
throw new Error("Book constructor requires a isbn.");
}
this.isbn = isbn;
this.title = title || "";
this.author = author || "";
}
Book.prototype.display = function() {
return "Book: ISBN: " + this.isbn + ",Title: " + this.title + ",Author: " + this.author;
}

display方法依賴於isbn是否正確，如果不是你將無法擷取映像以及連結。考慮到這點，每本圖書isbn必須存在的，而圖書的標題和作者是可選的。表面上看只要指定一個isbn參數似乎就能正常運行。但卻不能保證isbn的完整性，基於此我們加入isbn的驗證，使圖書的檢查更加健壯。 複製代碼 代碼如下:var Book = function(isbn, title, author) {
if(!this.checkIsbn(isbn)) {
throw new Error("Book: invalid ISBN.");
}
this.isbn = isbn;
this.title = title || "";
this.author = author || "";
}
Book.prototype = {
checkIsbn: function(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
},
display: function() {
return "Book: ISBN: " + this.isbn + ",Title: " + this.title + ",Author: " + this.author;
}
};

我們添加了checkIsbn()來驗證ISBN的有效性，確保display()可以正常運行。但是需求有變化了，每本書可能有多個版本，意味著同一本可能有多個ISBN號存在，需要維護單獨的選擇版本的演算法來控制。同時儘管能檢查資料的完整性，但卻無法控制外部對內部成員的訪問(如對isbn,title,author賦值)，就談不上保護內部資料了。我們繼續改進這個方案，採用介面實現(提供get訪問器/set儲存空間)。 複製代碼 代碼如下:var Publication = new Interface("Publication", ["getIsbn", "setIsbn", "checkIsbn", "getTitle", "setTitle", "getAuthor", "setAuthor", "display"]);
var Book = function(isbn, title, author) {
// implements Publication interface
this.setIsbn(isbn);
this.setTitle(title);
this.setAuthor(author);
}
Book.prototype = {
getIsbn: function() {
return this.isbn;
},
setIsbn: function(isbn) {
if(!this.checkIsbn(isbn)) {
throw new Error("Book: Invalid ISBN.");
}
this.isbn = isbn;
},
checkIsbn: function(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
},
getTitle: function() {
return this.title;
},
setTitle: function(title) {
this.title = title || "";
},
getAuthor: function() {
return this.author;
},
setAuthor: function(author) {
this.author = author || "";
},
display: function() {
return "Book: ISBN: " + this.isbn + ",Title: " + this.title + ",Author: " + this.author;
}
};

現在就可以通過介面Publication來與外界進行通訊。賦值方法也在構造器內部完成，不需要實現兩次同樣的驗證，看似非常完美的完全暴露對象方案了。雖然能通過set儲存空間來設定屬性，但這些屬性仍然是公有的，可以直接賦值。但此方案到此已經無能為力了，我會在第二種資訊隱藏解決方案中來最佳化。儘管如此，此方案對於那些沒有深刻理解範圍的新手非常容易上手。唯一的不足是不能保護內部資料且儲存空間增加了多餘的不必要代碼。
2. 使用命名規則的私人方法。就是使用底線來標識私人成員，避免無意中對私人成員進行賦值，本質上與完全暴露對象是一樣的。但這卻避免了第一種方案無意對私人成員進行賦值操作，卻依然不能避免有意對私人成員進行設定。只是說定義了一種命名規範，需要團隊成員來遵守，不算是一種真正的內部資訊隱藏的完美方案。 複製代碼 代碼如下:var Publication = new Interface("Publication", ["getIsbn", "setIsbn", "getTitle", "setTitle", "getAuthor", "setAuthor", "display"]);
var Book = function(isbn, title, author) {
// implements Publication interface
this.setIsbn(isbn);
this.setTitle(title);
this.setAuthor(author);
}
Book.prototype = {
getIsbn: function() {
return this._isbn;
},
setIsbn: function(isbn) {
if(!this._checkIsbn(isbn)) {
throw new Error("Book: Invalid ISBN.");
}
this._isbn = isbn;
},
_checkIsbn: function(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
},
getTitle: function() {
return this._title;
},
setTitle: function(title) {
this._title = title || "";
},
getAuthor: function() {
return this._author;
},
setAuthor: function(author) {
this._author = author || "";
},
display: function() {
return "Book: ISBN: " + this.getIsbn() + ",Title: " + this.getTitle() + ",Author: " + this.getAuthor();
}
};

注意：除了isbn,title,author屬性被加上"_"標識為私人成員外，checkIsbn()也被標識為私人方法。

3. 通過閉包來真正私人化成員。如果對閉包概念中的範圍和嵌套函數不熟悉的朋友，可以參考"物件導向的Javascript之一(初識Javascript)"文章，這裡不再詳細論述。 複製代碼 代碼如下:var Publication = new Interface("Publication", ["getIsbn", "setIsbn", "getTitle", "setTitle", "getAuthor", "setAuthor", "display"]);
var Book = function(newIsbn, newTitle, newAuthor) {
// private attribute
var isbn, title, author;
// private method
function checkIsbn(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
}
// previleged method
this.getIsbn = function() {
return isbn;
};
this.setIsbn = function(newIsbn) {
if(!checkIsbn(newIsbn)) {
throw new Error("Book: Invalid ISBN.");
}
isbn = newIsbn;
}
this.getTitle = function() {
return title;
},
this.setTitle = function(newTitle) {
title = newTitle || "";
},
this.getAuthor: function() {
return author;
},
this.setAuthor: function(newAuthor) {
author = newAuthor || "";
}
// implements Publication interface
this.setIsbn(newIsbn);
this.setTitle(newTitle);
this.setAuthor(newAuthor);
}
// public methods
Book.prototype = {
display: function() {
return "Book: ISBN: " + this.getIsbn() + ",Title: " + this.getTitle() + ",Author: " + this.getAuthor();
}
};

這種方案與上一種有哪些不同呢？首先，在構造器中使用var來聲明三個私人成員，同樣也聲明了私人方法checkIsbn()，僅僅在構造器中有效。使用this關鍵字聲明特權方法，即聲明在構造器內部但卻可以訪問私人成員。任何不需要訪問私人成員的方法都在Book.prototype中聲明(如：display)，也即是將需要訪問私人成員的方法聲明為特權方法是解決這個問題的關鍵。但此訪問也有一定缺陷，如對每一個執行個體而言，都要建立一份特權方法的副本，勢必需要更多記憶體。我們繼續最佳化，採用靜態成員來解決所面臨的問題。順便提一句：靜態成員僅僅屬於類，所有的對象僅共用一份副本(在"物件導向的Javascript之二(實現介面)中有說明，參見Interface.ensureImplements方法")，而執行個體方法是針對對象而言。 複製代碼 代碼如下:var Publication = new Interface("Publication", ["getIsbn", "setIsbn", "getTitle", "setTitle", "getAuthor", "setAuthor", "display"]);
var Book = (function() {
// private static attribute
var numsOfBooks = 0;
// private static method
function checkIsbn(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
}
// return constructor
return function(newIsbn, newTitle, newAuthor) {
// private attribute
var isbn, title, author;
// previleged method
this.getIsbn = function() {
return isbn;
};
this.setIsbn = function(newIsbn) {
if(!Book.checkIsbn(newIsbn)) {
throw new Error("Book: Invalid ISBN.");
}
isbn = newIsbn;
}
this.getTitle = function() {
return title;
},
this.setTitle = function(newTitle) {
title = newTitle || "";
},
this.getAuthor = function() {
return author;
},
this.setAuthor = function(newAuthor) {
author = newAuthor || "";
}
Book.numsOfBooks++;
if(Book.numsOfBooks > 50) {
throw new Error("Book: at most 50 instances of Book can be created.");
}
// implements Publication interface
this.setIsbn(newIsbn);
this.setTitle(newTitle);
this.setAuthor(newAuthor);
};
})();
// public static methods
Book.convertToTitle = function(title) {
return title.toUpperCase();
}
// public methods
Book.prototype = {
display: function() {
return "Book: ISBN: " + this.getIsbn() + ",Title: " + this.getTitle() + ",Author: " + this.getAuthor();
}
};

這種方案與上種相似，使用var和this來建立私人成員和特權方法。不同之處在於使用閉包來返回構造器，並將checkIsbn聲明為私人靜態方法。可能有人會問，我為什麼要建立私人靜態方法，答案在於使所有對象公用一份函數副本而已。我們這裡建立的50個執行個體都只有一個方法副本checkIsbn，且屬於類Book。根據需要，你也可以建立公有的靜態方法供外部調用(如：convertToTitle)。這裡我們繼續考慮一個問題，假設以後我們需要對不同的書做限制，比如<<Javascript進階編程>>最大印發量為500，<<.NET>>最大印發量為1000，也即說需要一個最大印發量的常量。思考一下，利用已有的知識，我們如何聲明一個常量呢？其實不難，我們想想，可以利用一個只有訪問器的私人特權方法就可以實現。 複製代碼 代碼如下:var Publication = new Interface("Publication", ["getIsbn", "setIsbn", "getTitle", "setTitle", "getAuthor", "setAuthor", "display"]);
var Book = (function() {
// private static attribute
var numsOfBooks = 0;
// private static contant
var Constants = {
"MAX_JAVASCRIPT_NUMS": 500,
"MAX_NET_NUMS": 1000
};
// private static previleged method
this.getMaxNums(name) {
return Constants[name.ToUpperCase()];
}
// private static method
function checkIsbn(isbn) {
if(isbn == undefined || typeof isbn != "string") return false;
isbn = isbn.replace("-", "");
if(isbn.length != 10 && isbn.length != 13) return false;
var sum = 0;
if(isbn.length == 10) {
if(!isbn.match(\^\d{9}\)) return false;
for(var i = 0;i < 9;i++) {
sum += isbn.charAt(i) * (10 - i);
}
var checksum = sum % 11;
if(checksum == 10) checksum = "X";
if(isbn.charAt(9) != checksum) return false;
} else {
if(!isbn.match(\^\d{12}\)) return false;
for(var i = 0;i < 12;i++) {
sum += isbn.charAt(i) * (i % 2 == 0 ? 1 : 3);
}
var checksum = sum % 10;
if(isbn.charAt(12) != checksum) return false;
}
return true;
}
// return constructor
return function(newIsbn, newTitle, newAuthor) {
// private attribute
var isbn, title, author;
// previleged method
this.getIsbn = function() {
return isbn;
};
this.setIsbn = function(newIsbn) {
if(!Book.checkIsbn(newIsbn)) {
throw new Error("Book: Invalid ISBN.");
}
isbn = newIsbn;
}
this.getTitle = function() {
return title;
},
this.setTitle = function(newTitle) {
title = newTitle || "";
},
this.getAuthor = function() {
return author;
},
this.setAuthor = function(newAuthor) {
author = newAuthor || "";
}
Book.numsOfBooks++;
if(Book.numsOfBooks > 50) {
throw new Error("Book: at most 50 instances of Book can be created.");
}
// implements Publication interface
this.setIsbn(newIsbn);
this.setTitle(newTitle);
this.setAuthor(newAuthor);
};
})();
// public static methods
Book.convertToTitle = function(title) {
return title.toUpperCase();
}
// public methods
Book.prototype = {
display: function() {
return "Book: ISBN: " + this.getIsbn() + ",Title: " + this.getTitle() +
",Author: " + this.getAuthor() + ", Maximum: ";
},
showMaxNums: function() {
return Book.getMaxNums("MAX_JAVASCRIPT_NUMS");
}
};

最完美的情況就是你所封裝的程式對調用者而言，僅僅需要知道你的介面就可以，根本不關心你如何?。但問題在於，隨著工程量的擴大，你的封裝內容必然會增大，在項目發生交接時，對於一個對範圍和閉包等概念不熟悉的成員來說，維護難度會變得如此之大。有些時候應需求響應必須改動源碼(這裡不一定指改介面)，可能是新增一些細節，即使拿到你的源碼卻無從下手，那就不好做了。因此，我的建議：封裝不要過度，介面一定要清晰，可擴充。