Javascript 物件導向（二）封裝代碼

寫個小例子：

第一步:做一個“手機的類" 複製代碼 代碼如下:var MobilePhone = (function(){
　　　　…………
})()

第二步：考慮這個類，裡需要那些類的私人屬性，這裡我想定義的是執行個體出來手機的數量 複製代碼 代碼如下:var MobilePhone = (function(){
//私人屬性
var count = 0; //代表手機的數量
})()

第三步：建立一個建構函式，即執行個體時候，對產生的新象的一個初始化，例如屬性，方法的初始化;在這個例子中，每一個手機都會有顏色，大小，價格屬性.這裡的建構函式也是一個閉包，所以可以訪問count，並且count的值會長期儲存在記憶體中（只要有引用存在）

複製代碼 代碼如下:var MobilePhone = (function(){
//私人屬性
var count = 0; //代表手機的數量
　　　　
　　　　//建構函式
　　　　var creatphone = function(color,size,price){
　　　　　　　　count++;
　　　　　　　　this._color = color; //手機的顏色
　　　　　　　　this._size = size; //手機的大小
　　　　　　　　this._price = price; //手機的價格
　　　　　　　　this.index = count; //手機索引，是第幾台建立的手機手象
　　　　　}
})()

第四步：共有方法：
即所有執行個體出來的手機對象，都能使用的方法，這裏手機應該可以改變價格，顏色，大小，也可以顯示大小，顏色，價格。
這裡的共有方法應該放在“原型對象”中：
1.所有通過該建構函式執行個體的對象，也就是造出的手機，都能使用“原型對象”中的方法。
2.如果放在建構函式中，那麼每一次執行個體一個手機對象出來，都會產生一堆重複的方法，佔用記憶體。
3."constructor":creatphone解釋：
因為creatphone.prototype ={……}相當對把之前的原型對象的引用，給複蓋掉了。而為了讓原型對象和該建構函式關聯起來 設定了"constructor":creatphone,這個屬性. 複製代碼 代碼如下:var MobilePhone = (function(){
//私人屬性
var count = 0;//代表手機的數量
　　　　//建構函式
　　　　 var creatphone = function(color,size,price){
　　　　　　　　count++;
　　　　　　　　this._color = color; //手機的顏色
　　　　　　　　this._size = size; //手機的大小
　　　　　　　　this._price = price; //手機的價格
　　　　　　　　this.index = count; //手機索引，是第幾台建立的手機手象
　 　　　　}
//公有方法，存放在原型對象中
creatphone.prototype = {
　　　　　　"constructor":creatphone,
　　　　　　//擷取手機顏色
"getColor" : function(){
return this._color;
},
　　　　　　//設定手機顏色
"setColor" : function(color){
this._color = color;
},
　　　　　　//擷取手機大小
"getSize" : function(){
return "width:"+this._size.width + " height:" + this._size.height;
},
　　　　　　//設定手機大小
"setSize" : function(size){
this._size.width = size.width;
this._size.height = size.height;
},
　　　　　　//擷取手機價格
"getPrice" : function(){
return this._price;
},
　　　　　　//設定手機價格
"setPrice" : function(price){
this._price = price
}
}
})()

第五步：特權方法，即需要有一個方法，能夠去訪問類的私人變數。就是執行個體出來多少台手機對象 複製代碼 代碼如下:var MobilePhone = (function(){
//私人屬性
var count = 0;//代表手機的數量
var index = 0;//代表手機的索引
　　　　//建構函式
　　　　var creatphone = function(color,size,price){
　　　　　　　　count++;
　　　　　　　　this._color = color; //手機的顏色
　　　　　　　　this._size = size; //手機的大小
　　　　　　　　this._price = price; //手機的價格
　　　　　　　　this.index = count; //手機索引，是第幾台建立的手機手象
　　　　　　}　　　　　//公有方法，存放在原型對象中
creatphone.prototype = {
"constructor":creatphone,
"getColor" : function(){
return this._color;
},
"setColor" : function(color){
this._color = color;
},
"getSize" : function(){
return "width:"+this._size.width + " height:" + this._size.height;
},
"setSize" : function(size){
this._size.width = size.width;
this._size.height = size.height;
},
"getPrice" : function(){
return this._price;
},
"setPrice" : function(price){
this._price = price
}
}
//特權方法
creatphone.get_count_index = function(){
return count
}
return creatphone;
})()

用上面封裝的一個手機類 測試 複製代碼 代碼如下:var anycall = new MobilePhone(); //執行個體一個三星手機對象
var HTC = new MobilePhone(); //執行個體一個HTC手機對象
var Iphone4s = new MobilePhone(); //執行個體一個蘋果4S手機對象
console.log("三星是第："+anycall.index+"台"); //FF的控制台輸出三星手機對象是第幾台建立的，即索引；
console.log("HTC是第："+HTC.index+"台"); //FF的控制台輸出HTC手機對象是第幾台建立的，即索引；
console.log("Iphone4s是第："+Iphone4s.index+"台"); //FF的控制台輸出個蘋果4S手機對象是第幾台建立的，即索引；
console.log("總共造出了"+MobilePhone.get_count_index()+"手機"); //FF的控制台輸出總共建立了幾台手機；
console.log(anycall.constructor === MobilePhone); //執行個體出來的對象，的原形象中的constructor，是否還指向MobilePhone

結果如下，全完正確：