溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Javascript 之封裝(Package)

發(fā)布時間:2020-10-06 14:57:38 來源:腳本之家 閱讀:202 作者:java面試筆試 欄目:web開發(fā)

一、 構造函數(shù)(Constructor)模式的封裝
為了解決從原型對象生成實例的問題,Javascript提供了一個構造函數(shù)(Constructor)模式。
所謂"構造函數(shù)",其實就是一個普通函數(shù),但是內(nèi)部使用了this變量。對構造函數(shù)使用new運算符,就能生成實例,并且this變量會綁定在實例對象上。
舉個例子,下面生成的是狗的原型對象:

function Dog(name,color,species){

this.name = name;

this.color = color;

this.species = species;

this.type = "犬科動物";

}

生成實例對象如下:

var dog1 = new Dog("大黃","黃色","中華田園犬");

var dog2 = new Dog("小黑","黑色","德國黑背");

alert(dog1.name); //大黃

alert(dog2.color); //黑色

這時dog1和dog2會自動含有一個constructor屬性,指向它們的構造函數(shù)。

alert(dog1.constructor == Dog); //true

alert(dog2.constructor == Dog); //true

Javascript還提供了一個instanceof運算符,驗證原型對象與實例對象之間的關系。

alert(dog1 instanceof Dog); //true

alert(dog2 instanceof Dog); //true

但是,構造函數(shù)模式也存在浪費內(nèi)存的問題。因為對于每一個實例對象,type屬性都是一樣的內(nèi)容,每生成一個實例對象,都必須為重復的內(nèi)容多分配一次內(nèi)存,這樣既不節(jié)省,也缺乏效率。因此,我們應該想出一種讓type這樣的屬性在內(nèi)存中只生成一次,并且所有實例都指向這個內(nèi)存地址的方法。

二、 構造函數(shù)結合原型屬性(Prototype)模式的封裝
針對構造函數(shù)方法會浪費內(nèi)存的問題,有下面的解決方案,即將那些不變的屬性和方法,直接定義在構造函數(shù)的Prototype對象上。

function Dog(name,color,species){

this.name = name;

this.color = color;

this.species = species;

}

Dog.prototype.type = "犬科動物";

生成實例對象如下:

var dog1 = new Dog("大黃","黃色","中華田園犬");

var dog2 = new Dog("小黑","黑色","德國黑背");

alert(dog1.type); //犬科動物

這時所有實例的type屬性,其實都是同一個內(nèi)存地址,指向prototype對象,因此就提高了運行效率。


三、 Prototype模式的驗證方法
為了配合prototype屬性,Javascript定義了一些輔助方法,幫助我們使用它。

3.1 isPrototypeOf()

這個方法用來判斷,某個proptotype對象和某個實例之間的關系。

alert(Dog.prototype.isPrototypeOf(dog1)); //true

alert(Dog.prototype.isPrototypeOf(dog2)); //true

3.2 hasOwnProperty()

每個實例對象都有一個hasOwnProperty()方法,用來判斷某一個屬性到底是本地屬性,還是繼承自prototype對象的屬性。

alert(dog1.hasOwnProperty("name")); // true

alert(dog1.hasOwnProperty("type")); // false

3.3 in運算符

in運算符可以用來判斷,某個實例是否含有某個屬性,不管是不是本地屬性。

alert("name" in dog1); // true

alert("type" in dog1); // true

in運算符還可以用來遍歷某個對象的所有屬性。

for(var prop in dog1) { alert("dog1["+prop+"]="+dog1[prop]); }

總結
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學習或者工作具有一定的參考學習價值,謝謝大家對億速云的支持。如果你想了解更多相關內(nèi)容請查看下面相關鏈接

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內(nèi)容。

AI