明白javascript封裝
封裝可以被定義為對對象的內(nèi)部數(shù)據(jù)表現(xiàn)形式和實(shí)現(xiàn)細(xì)節(jié)進(jìn)行隱藏。通過封裝可以強(qiáng)制實(shí)施信息隱藏。
在JavaScript中，并沒有顯示的聲明私有成員的關(guān)鍵字等。所以要想實(shí)現(xiàn)封裝/信息隱藏就需要從另外的思路出發(fā)。我們可以使用閉包的概念來創(chuàng)建只允許從對象內(nèi)部訪問的方法和屬性，來達(dá)到封裝的要求。
基本方式
一般來說，我們學(xué)用的有三種方法來達(dá)到封裝的目的。
使用this.XXX來聲明一個(gè)變量，然后再聲明getXXX、setXXX等取值、賦值的方法。
使用this._XXX來聲明一個(gè)變量，然后再聲明getXXX、setXXX等取值、賦值的方法。
利用“函數(shù)作用域”這一個(gè)概念來做。
1. 門戶大開型
var Book = function(isbn,title,author){ this.setIsbn(isbn); this.setTitle(title); this.setAuthor(author); }; Book.prototype = { setIsbn: function(isbn){ this.isbn = isbn; }, getIsbn: function(){ return this.isbn; }, setTitle: function(title){ this.title = title; }, getTitle: function(){ return this.title; }, setAuthor: function(author){ this.author = author; }, getAuthor: function(){ return this.author; } };
使用這種方法實(shí)現(xiàn)的封裝，雖然實(shí)現(xiàn)了取值器與賦值器以保護(hù)私有屬性。但是在實(shí)際使用中，私有屬性依然可以從外部訪問，所以從根本上講，沒有實(shí)現(xiàn)封裝。
2. 用命名規(guī)范進(jìn)行區(qū)別
var Book = function(isbn,title,author){ this.setIsbn(isbn); this.setTitle(title); this.setAuthor(author); }; Book.prototype = { setIsbn: function(isbn){ this._isbn = isbn; }, getIsbn: function(){ return this._isbn; }, setTitle: function(title){ this._title = title; }, getTitle: function(){ return this._title; }, setAuthor: function(author){ this._author = author; }, getAuthor: function(){ return this._author; } };
使用這種方法與第一種類似，區(qū)別在于使用不同的命名來保護(hù)私有屬性的使用。但是，從實(shí)際應(yīng)用來說其仍然沒有實(shí)現(xiàn)封裝。
3. 使用函數(shù)作用域
var Book = function(newIsbn,newTitle,newAuthor){ var isbn,title,author; this.setIsbn=function(newIsbn){ isbn = newIsbn; }; this.getIsbn=function(){ return isbn; }; this.setTitle=function(newTitle){ title = newTitle; }; this.getTitle=function(){ return title; }; this.setIsbn=function(newAuthor){ author = newAuthor; }; this.getIsbn=function(){ return author; }; }
由于在JavaScript的函數(shù)中聲明的變量是有作用域的，所以使用這種方法可以避免在外部直接訪問私有屬性。基本達(dá)到封裝所要求的內(nèi)容。
這里要注意的是，我們在函數(shù)的內(nèi)部，可以使用this.XXX以及var來聲明變量。區(qū)別是使用this.XXX聲明的變量在外部是可以訪問的。使用var聲明的變量，由于受到函數(shù)作用域的保護(hù)，在函數(shù)的外部是無法直接訪問的。
4. 使用函數(shù)作用域的變形
var Book = (function(){ // ...其他靜態(tài)方法 return function(newIsbn,newTitle,newAuthor){ var isbn,title,author; this.setIsbn=function(newIsbn){ isbn = newIsbn; }; this.getIsbn=function(){ return isbn; }; this.setTitle=function(newTitle){ title = newTitle; }; this.getTitle=function(){ return title; }; this.setIsbn=function(newAuthor){ author = newAuthor; }; this.getIsbn=function(){ return author; }; }; })();
這種方法是直接返回一個(gè)構(gòu)造器的執(zhí)行。且這里的構(gòu)造器是一個(gè)內(nèi)嵌函數(shù)。
這種方法的優(yōu)點(diǎn)是“在內(nèi)存中只會存在一份。因?yàn)槠渌o態(tài)方法被聲明在構(gòu)造器之外，所以它們不是特權(quán)方法。”
判斷一個(gè)方法是否應(yīng)該被設(shè)計(jì)為靜態(tài)方法的原則是“這個(gè)方法是否會訪問私有屬性”。如果它不需要，那么將其設(shè)計(jì)為靜態(tài)方法會更有效率，因?yàn)樗粫粍?chuàng)建一份。
常量
我們可以使用“只有取值器，沒有賦值器”的方式來實(shí)現(xiàn)常量。
// 1. var Book = function(){ var constants = ["key1": "1","key2": "2","key3": "3"]; this.getConstant = function(key){ return constants[key]; }; }; Book.getConstant("key1"); // 2. var Book = (function(){ var constants = ["key1": "1","key2": "2","key3": "3"]; var con = function(){}; con.getConstant = function(name){ return constants[name]; }; return con; })(); Book.getConstant("key1");
利弊
1、利處
封裝保護(hù)了內(nèi)部數(shù)據(jù)的完整性；
封裝使對象的重構(gòu)更輕松；
弱化模塊間的耦合，提高對象的可重用性；
有助于避免命名空間沖突；
……
2、弊處
私用方法很難測試；
必須與復(fù)雜的作用域鏈打交道，使錯(cuò)誤調(diào)度更困難；
容易形成過度封裝；
JavaScript并不原生支持封裝，所以在JavaScript中實(shí)現(xiàn)封裝存在復(fù)雜性的問題；
【明白javascript封裝】相關(guān)文章：
對javascript的理解08-08
常用的JavaScript模式09-22
Javascript的this用法簡述08-15
JavaScript 基礎(chǔ)教學(xué)09-29
JavaScript的課堂講解09-03
JavaScript常用方法匯總10-25
JavaScript中的with關(guān)鍵字07-24
高效編寫JavaScript代碼的技巧08-25