Javascript 物件導向(二)封裝

2021-09-08 03:32:08 字數 2506 閱讀 5276

寫個小例子:

第一步:做乙個「手機的類"

var mobilephone = (function())()
第二步:考慮這個類,裡需要那些類的私有屬性,這裡我想定義的是例項出來手機的數量

var mobilephone = (function

())()

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

var mobilephone = (function() 

})()

第四步:共有方法:

即所有例項出來的手機物件,都能使用的方法,這裡手機應該可以改變**,顏色,大小,也可以顯示大小,顏色,**。

這裡的共有方法應該放在「原型物件」中:

1.所有通過該建構函式例項的物件,也就是造出的手機,都能使用「原型物件」中的方法。

2.如果放在建構函式中,那麼每一次例項乙個手機物件出來,都會產生一堆重複的方法,占用記憶體。

3."constructor":creatphone解釋:

因為creatphone.prototype =相當對把之前的原型物件的引用,給覆蓋掉了。而為了讓原型物件和該建構函式關聯起來 設定了"constructor":creatphone,這個屬性.

var mobilephone = (function() 

//公有方法,存放在原型物件中

creatphone.prototype =,

//設定手機顏色

"setcolor" : function

(color),

//獲取手機大小

"getsize" : function

(),      

//設定手機大小

"setsize" : function

(size),

//獲取手機**

"getprice" : function

(),      

//設定手機**

"setprice" : function

(price)

}})()

第五步:特權方法,即需要有乙個方法,能夠去訪問類的私有變數。就是例項出來多少臺手機物件

var mobilephone = (function

()

//

公有方法,存放在原型物件中

creatphone.prototype =,

"setcolor" : function

(color),

"getsize" : function

(), "setsize" : function

(size),

"getprice" : function

(), "setprice" : function

(price)

}//特權方法

creatphone.get_count_index = function

()

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

結果如下,全完正確:

JavaScript物件導向

方法一 建構函式法 function cat cat.prototype.showname function var cat new cat cat.name tom cat.showname tom 它用建構函式模擬 類 在其內部用this關鍵字指代例項物件。類的屬性和方法,還可以定義在建構函式的...

javaScript物件導向

code 類lecture構造器 使用兩個字串函式,name和teacher function lecture name,teacher 類lecture的方法,生成乙個顯示該課程資訊的字串 lecture.prototype.display function 類schedule的構造器 使用乙個l...

Javascript 物件導向

什麼是物件everything is object 萬物皆物件 物件到底是什麼,我們可以從兩次層次來理解。1 物件是單個事物的抽象。一本書 一輛汽車 乙個人都可以是物件,乙個資料庫 一張網頁 乙個與遠端伺服器的連線也可以是物件。當實物被抽象成物件,實物之間的關係就變成了物件之間的關係,從而就可以模擬...