JavaScript 物件 設計模式

2021-08-29 12:11:32 字數 3122 閱讀 7094

概念

無序屬性的集合,其屬性可以包含基本值、物件或者函式。」嚴格來講,這就相當於說物件是一組沒有特定順序的值。物件的每個屬性或方法都有乙個名字,而每個名字都對映 到乙個值。正因為這樣,我們可以把物件想象成雜湊表: 無非就是一組名值對,其中值可以是資料或函式。

物件的屬性

資料屬性:

修改屬性預設的特性: object.defineproperty()方法

這個方法 接收三個引數:屬性所在的物件、屬性的名字和乙個描述符物件。其中,描述符(descriptor)物件的屬 性必須是:configurable、enumerable、writable 和 value。設定其中的一或多個值,可以修改 對應的特性值。

var person =

; object.

defineproperty

(person,

"name",)

;alert

(person.name)

;//"nicholas"

person.name =

"greg"

;alert

(person.name)

;//"nicholas"

訪問器屬性:

在讀取訪問器屬性時,會呼叫 getter 函式,這個函式負責返回有效的值;在寫入訪問器屬性時,會呼叫 setter 函式並傳入新值,這個函式負責決定如何處理資料。訪問器屬性有如下 4 個特性

訪問器屬性不能直接定義,必須通過 object.defineproperty() 方法來定義

var book =

; object.

defineproperty

(book,

"year",,

set:

function

(newvalue)}}

);book.year =

2005

;alert

(book.edition)

;//2

不一定非要同時指定 getter 和 setter。只指定 getter 意味著屬性是不能寫,嘗試寫入屬性會被忽略。 在嚴格模式下,嘗試寫入只指定了 getter 函式的屬性會丟擲錯誤。類似地,只指定 setter 函式的屬性也 不能讀,否則在非嚴格模式下會返回 undefined,而在嚴格模式下會丟擲錯誤。

object.defineproperties()方法:

利用這個方法可以通過描述符一次定義多個屬性。這個方法接收兩個物件引數:第一 個物件是要新增和修改其屬性的物件,第二個物件的屬性與第乙個物件中要新增或修改的屬性一一對應。例如:

var book =

; object.

defineproperties

(book,

, edition:

, year:

,set

:function

(newvalue)}}

});

object.getownpropertydescriptor()方法:

可以取得給定屬性的描述 符。這個方法接收兩個引數:屬性所在的物件和要讀取其描述符的屬性名稱。返回值是乙個物件,如果 是訪問器屬性,這個物件的屬性有 configurable、enumerable、get 和 set;如果是資料屬性,這 個物件的屬性有 configurable、enumerable、writable 和 value。

1. object 建構函式/物件字面量,缺點:使用同乙個介面建立多個物件,會產生大量重複的**。

2. 工廠模式

function

createperson

(name, age, job)

;return o;

} 這種模式抽象了建立具體物件的過程,用函式來封裝以特定介面來建立物件的細節。解決了建立多個相似物件的問題,卻沒有解決物件的識別問題,即怎樣知道乙個物件的型別。

2. 建構函式模式

function

person

(name, age, job);}

1) 沒有顯式地建立物件;

2) 直接將屬性和方法賦給了 this 物件;

3) 沒有 return 語句。

要建立 person 的新例項,必須使用 new 操作符。以這種方式呼叫建構函式實際上會經歷以下 4 個步驟:(1

) 建立乙個新物件;(2

)將建構函式的作用域賦給新物件

(因此 this 就指向了這個新物件);(

3)執行建構函式中的**

(為這個新物件新增屬性);(

4) 返回新物件。

可以將建構函式的名稱當作一種特定的型別,這是比工廠模式好的地方。

缺點:每個方法都要在每個例項上重新建立一遍

改進:function

person

(name, age, job)

function

sayname()

3. 原型模式

function

person()

person.prototype.name =

"nicholas"

; person.prototype.age =29;

person.prototype.job =

"software engineer"

; person.prototype.

sayname

=function()

; 好處:可以讓所有物件例項共享它所包含的屬性和方法,不必在建構函式中定義物件例項的資訊。

缺點:1) 所有例項在預設情況下都會取得相同的預設值。

2) 如果原型中包含引用型資料,當例項修改時,所有例項都會發生變化。

4. 組合使用建構函式模式和原型模式

function

person

(name, age, job)

person.prototype =

} 建構函式用於定義例項屬性,原型模式用於定義方法和共享屬性。

5. 動態原型模式

function

person

(name, age, job);}

}

JavaScript設計模式 架構型設計模式簡介

指的是一類框架結構,通過提供一些子系統,指定它們的職責,並且將它們調理清晰組織在一起。主要包含了同步模組模式 非同步模組模式 widget模式 mvc模式 mvp模式 mvvm模式 模組化把複雜的系統分解為高內聚 低耦合的模組,讓系統開發變得可控 可維護 可拓展,提高模組的復用率。同步模組模式 sm...

JavaScript 物件設計模式

原始的方式 建立物件,然後給它設定幾個屬性 函式建立物件方法 解決原始的方式每建立乙個例項都需要建立乙個原始的方式 函式建立物件方法傳遞引數 讓上面的函式建立物件方法可以傳遞屬性 函式建立物件方法傳遞函式方法 工廠函式外定義物件的方法,然後通過屬性指向該方法 function showcolor f...

JavaScript設計模式九(模板方法模式)

定義 模板方法模式是一種只需要使用繼承就可以實現的非常簡單的模式 模板方法模式由兩部分組成,第一部分是抽象父類,另一部分是具體的實現子類。通常抽象父類中封裝了子類的演算法框架,包括實現一些公共的方法以及封裝子類中所有方法的執行順序。子類通過繼承這個類,然後繼承了這個演算法,然後重寫父類的方法 例子是...