js建立物件的幾種方式

2021-08-05 21:18:00 字數 3160 閱讀 8518

雖然object建構函式或物件字面量都可以建立單個物件,但這些方式有個明顯的缺點,那就是使用同乙個介面創造很多物件,會產生大量的重複**。所以產生了下面幾種模式。

1 工廠模式

function

createperson

(name,age,job);

o.name = name;

o.age = age;

o.job = job;

o.sayname = function

(); return o;

} var tanya = createperson("tanya","30","female");

tanya.sayname();

特點:這種模式抽象了建立具體物件的過程。它用函式來封裝以特定介面建立物件的細節。

弊端:沒有解決物件識別的問題,而且每次生成乙個新物件,都要建立新函式sayname,這使得每個物件都有自己的sayname版本,而事實上,所有的物件都共享同乙個函式.

2 建構函式模式

function

createperson

(name,age,job);

} var tanya =new createperson("tanya","30","female");

tanya.sayname();

ps:建構函式和普通函式的唯一區別就是呼叫他們的方式不同:任何函式,只要通過new操作符呼叫就是建構函式,反之就是普通函式。

使用new操作符建立新例項會經歷下面4個步驟:

(1) 建立乙個新物件

(2) 將建構函式的作用域賦給新物件(就是this指向了這個新物件)

(3) 執行建構函式中的**(為這個新物件新增屬性)

(4) 返回新物件

建構函式和工廠模式的不同之處:

沒有顯示的建立物件

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

沒有return語句

建構函式解決了物件識別的問題(tanya有乙個constructor屬性,該屬性指向createperson),但是就像工廠模式一樣,每個方法都會在每個例項中重新建立一遍。我們可以把函式定義轉移到建構函式外部來解決這個問題,但是這樣就沒有封裝性可言了。

3 原型模式

首先介紹一下prototype(原型)屬性,我們建立的每個函式都有乙個prototype屬性,這個屬性是乙個指標,指向乙個物件,而這個物件的用途是包含可以由特定型別的所有例項共享的屬性和方法。

ps:js中萬物皆物件,但分為兩大類:普通物件和函式物件。所有的函式物件都有乙個prototype屬性,普通物件是沒有prototype屬性的,只有proto。

function createperson()

createperson.prototype

.name = "tanya"

; createperson.prototype

.age = "30"

; createperson.prototype

.job = "female"

; createperson.prototype

.sayname = function();

var tanya =new createperson();

tanya.sayname();

原型模式雖然解決了建構函式每個方法都會在每個例項中重新建立一遍的問題。但是所有例項在預設情況下都取得了相同的屬性值,例項一般都是要有屬於自己的全部屬性的。

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

function

createperson

(name,age,job)

createperson.prototype.sayname = function

(); var tanya =new createperson("tanya","30","female");

tanya.sayname();

這是建立自定義型別的最常見方式,建構函式模式定義例項屬性,原型模式定義方法和共享的屬性。

5 寄生建構函式模式

function

createperson

(name,age,job);

o.name = name;

o.age = age;

o.job = job;

o.sayname = function

(); return o;

} var tanya =new createperson("tanya","30","female");

tanya.sayname();

除了使用new操作符來定義新的物件,以及將其稱之為建構函式之外,其他和工廠模式定義一模一樣。因為建立時用了new,因此使得實現的過程不一樣(但是實現過程不重要),結果一樣。看起來更優雅

寄生建構函式可以在建構函式不適應的情況使用,比如建立具有額外方法的已有型別(如陣列,date型別等),但是又不汙染原有的型別。

6 穩妥建構函式模式

穩妥物件,指的是沒有公共屬性,其方法也不引用this的物件。

穩妥建構函式與寄生建構函式相似,但是有2點不同:新建立物件的例項方法不引用this,不使用new操作符呼叫建構函式。

function

createperson

(name, age, job) ;

o.saynameuc = function

() ;

return o;

}var person = person("nicholas", 32, "software engineer");

person.sayname(); // "nicholas"

person.saynameuc(); // "nicholas"

alert(person.name); // undefined

alert(person.nameuc); // undefined

凡是想設為 private 的成員都不要掛到 createperson 返回的物件 o 的屬性上面,掛上了就是 public 的了。這裡的 private 和 public 都是從形式上模擬其他 oo 語言來說的,其實現原理還是 js 中作用域、閉包和物件那一套。

js 建立物件的幾種方式

一 原始方式 解釋 原始方法建立物件,通過new關鍵字生成乙個物件,然後根據js是動態語言的特性新增屬性和方法,構造乙個物件。其中this是表示呼叫該方法的物件。缺點 多次建立物件,則需要重複 多次,不利於 的復用。二 工廠模式 var getage function var getname fun...

js 建立物件的幾種方式

第一種 工廠模式 例1 function createobj name,age return o var per1 createobj 張三 20 per1.sayinfo 缺點 無法知道物件的型別 第二種 建構函式模式 例2 function person name,age var per2 ne...

js建立物件的幾種方式

js高階程式設計有很詳細的說明,這裡就不做詳解了,只是做個筆記和總結,方便記憶和理解 1 工廠模式 最簡單的模式,生產並返回乙個object物件 function createper name var p1 createper js 2 建構函式形式,比較常用的形式,在元件封裝中經常用到。funct...