js JavaScript常見的建立物件的幾種方式

2021-09-07 09:09:43 字數 2333 閱讀 5952

這些方式有明顯的缺點:使用同乙個介面建立很多物件,會產生大量的重複**。為了解決這個問題,出現了工廠模式。

考慮在es中無法建立類(es6前),開發人員發明了一種函式,用函式來封裝以特定介面建立物件的細節。(實現起來是在乙個函式內建立好物件,然後把物件返回)。

function

createperson(name,age,job);

return 0;

}var person1=createperson("nicholas",29,"software engineer");

var person2=createperson("greg",27,"doctor");

函式createperson()能夠根據接受的引數來構建乙個包含所有必要資訊的person物件。工廠模式雖然解決了建立多個相似物件的問題,但卻沒有解決物件識別的問題,即怎麼知道乙個物件的型別。隨著js發展,又乙個模式出現了。

像object和array這樣的原生建構函式,在執行時會自動出現在執行環境。此外,也可以建立自定義的建構函式,從而定義自定義物件型別的屬性和方法。

function

person(name,age,job);

}var person1=new

person(...);

var person2=new person(...);

與工廠模式相比,具有以下特點:

沒有顯式建立物件;

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

沒有return語句;

要建立新例項,必須使用new操作符;(否則屬性和方法將會被新增到window物件)

可以使用instanceof操作符檢測物件型別

建構函式的問題:

建構函式內部的方法會被重複建立,不同例項內的同名函式是不相等的。可通過將方法移到建構函式外部解決這一問題,但面臨新問題:封裝性不好。

這些問題可通過原型模式解決。

我們建立的每個函式都有乙個prototype屬性,這個屬性是乙個指標,指向乙個物件,而這個物件的用途是包含可以由特定型別的所有例項共享的屬性和方法。(prototype就是通過呼叫建構函式而建立的那個物件例項的原型物件)。

使用原型物件的好處是可以讓所有物件例項共享它所包含的屬性和方法。換句話說,不必在建構函式中定義物件例項的資訊,而是可以將這些資訊直接新增到原型物件中。

function

person()

person.prototype.name="nicholas";

person.prototype.age=29;

person.prototype.job="...";

person.prototype.sayname=function

();var person1=new

person();

person1.sayname();

//"nicholas"

更常見的做法是用乙個包含所有屬性和方法的物件字面量來重寫整個原型物件,並重設constructor屬性。

function

person()

person.prototype=

};object.defineproperty(person.prototype,"constructor",);

原型物件的問題:

他省略了為建構函式傳遞初始化引數這一環節,結果所有例項在預設情況下都將取得相同的屬性值,雖然這會在一定程度帶來一定的不便,但不是最大的問題,最大的問題是由其共享的本性所決定的。

對於包含基本值的屬性可以通過在例項上新增乙個同名屬性隱藏原型中的屬性。然後,對於包含引用資料型別的值來說,會導致問題。

這些問題導致很少單獨使用原型模式。

這是建立自定義型別的最常見的方式。

建構函式模式用於定義例項屬性,而原型模式用於定義方法和共享的屬性。所以每個例項都會有自己的乙份例項屬性的副本,但同時共享著對方法的引用,最大限度的節省了記憶體。同時支援向建構函式傳遞引數。

function

person(name,age,job)

person.prototype=

};var person1=new person(...);

function

person(name,age,job);

}}

這裡只有sayname()不存在的情況下,才會將它新增到原型中,這段**只會在初次呼叫建構函式時才執行。這裡對原型所做的修改,能夠立刻在所有例項中得到反映。

es5定義了乙個名為object.create()的方法,它建立乙個新物件,其中第乙個引數是這個物件的原型,第二個引數對物件的屬性進行進一步描述。

JS JavaScript 學習筆記

1.1 變數 var 用於定義變數 例如 var a 等號用於給變數賦值 需要先定義變數 a 1 上面的內容可以簡寫為 var a 1 1.2 輸出內容 console.log 用於輸出內容 例如 console.log 我的身份是程式猿 輸出變數 console.log a 1.3 字串 var ...

JS JavaScript事件迴圈機制

首先區分程序和執行緒 瀏覽器的渲染程序是多執行緒的 gui渲染執行緒 js引擎執行緒 事件觸發執行緒 定時觸發器執行緒 非同步http請求執行緒 事件迴圈機制 上 釋 巨集任務 macrotask 和微任務 microtask 先看一段 的執行結果 console.log script start ...

9章 表單 js javaScript寶典

9.1 form物件 form物件 document.forms 0 使用元素名稱的字串作為陣列下標 document.forms formname 注意 陣列引用單詞的複數形式 另外可以使用表單名 document.formname 9.1訪問表單屬性 document.forms 0 actio...