摘要:構造函數(shù)與原型組合利用構造函數(shù)都是實例屬性和原型的共享特性,分別定義對應的內(nèi)容,組合共同完成對象創(chuàng)建,而且該模式還支持想構造函數(shù)傳遞參數(shù)。引用類型為實例屬性寄生構造模式構造函數(shù)在不反回值的情況下,默認會返回新對象實例。
創(chuàng)建對象 1.1 通過Object對象創(chuàng)建
var person = new Object(); person.name = "Albert"; person.sayName = function(){ console.log(this.name); };1.2 通過字面量創(chuàng)建
var person = { name : "Albert", sayName : function(){ console.log(this.name) } };Object和字面量創(chuàng)建的問題:
創(chuàng)建很多對象的時候會產(chǎn)生大量重復代碼。
1.3 工廠模式function createPerson(name){ var o = new Object(); o.name = name; o.sayName = function(){ console.log(this.name) } return o; } var person = createPerson("Albert");工廠模式的問題:
無法識別對象類型,即無法通過instanceof和constructor來識別對象類型:
person instanceof ???; person.constructor == ???;1.4 構造函數(shù)
function Person(name){ this.name = name; this.sayName = function(){ console.log(this.name) } } var person = new Person("Albert"); console.log(person.constructor == Person)//true console.log(person instanceof Person)//true構造函數(shù)的問題:
每個方法都要在每個實例上重新創(chuàng)建一次,尤其是函數(shù),這樣每個Person的實例都包含了一個不同的sayName的函數(shù)實例。
注意1
構造函數(shù)沒有return語句。要創(chuàng)建Person的新實例,必須采用new操作符,new操作符大體上完成了一下4件事情:
創(chuàng)建一個新的對象(本例中Person創(chuàng)建的新對象,記為person);
將構造函數(shù)的作用域賦給新對象(this=>person);
執(zhí)行構造函數(shù)中的代碼(Person中的this.name=name;this.say.....);
返回新對象
注意2
構造函數(shù)也是函數(shù),如果不通過new操作符調(diào)用,則作用環(huán)境為全局(瀏覽器中為windows,node環(huán)境中為global)
function Person(name){ this.name = name; this.sayName = function(){ console.log(this.name) } } Person("BB"); global.sayName()//BB console.log(global.name)//BB1.5 原型模式
function Person(name){} Person.prototype.name = "Albert"; Person.prototype.sayName = function(){ console.log(this.name) } var person = new Person(); console.log(Object.getPrototypeOf(person)==Person.prototype);//true
瀏覽器支持:IE9+,這樣所有的Person實例共享name屬性及sayName函數(shù)
注意1
對象的某個屬性是否來自實例,可通過hasOwnProperty()來確定,如果是在原型中,則返回false。
判斷對象是否具備屬性,可以通過in操作符,例如console.log("name" in person)//true來判斷,不論是在原型還是實例中,都返回true,通過for-in循環(huán)時,實例及原型中均會被枚舉。
注意2
在定義原型時,如果用字面量代替為prototype屬性定義,則原型的constructor屬性不會指向Person。因為通過字面量定義,完全重寫了默認的prototype對象。但是此時instanceof還是能夠返回正確的結果。
function Person(name){}; Person.prototype={ name : "Albert", sayName : function(){ console.log(this.name); } }; var person = new Person(); console.log(person instanceof Person);//true console.log(person.constructor == Person);//false console.log(person.constructor == Object);//true
所以可以再補充定義:
Object.defineProperty(Person.prototype,"constructor",{ enumerable:false, value:Person })
注意3
在重定義原型前,不能創(chuàng)建對象實例,否則會造成實例的原型指向錯誤
function Person(name){}; var person = new Person(); Person.prototype={ name : "Albert", sayName : function(){ console.log(this.name); } }; person.sayName(); //error
此例中person的原型被指向了Person的默認原型,固調(diào)用sayName函數(shù)會發(fā)生錯誤。
原型模式的問題:小問題:為了省略構造函數(shù)傳遞初始化參數(shù),所有的實例在默認情況下都會去的想通的屬性值
原型屬性被所有實例共享(適合function類型的值),而通常情況下,引用類型(Array、Object)屬性值一般不希望對所有實例共享。
1.6 構造函數(shù)與原型組合利用構造函數(shù)都是實例屬性和原型的共享特性,分別定義對應的內(nèi)容,組合共同完成對象創(chuàng)建,而且該模式還支持想構造函數(shù)傳遞參數(shù)。
function Person(name){ this.name = name; this.friends = ["Bob","Harry"];//引用類型為實例屬性 }; Person.prototype.sayName = function(){ console.log(this.name); };1.7 動態(tài)原型模式
將1.6中的組合封裝在一個構造函數(shù)中的模式。具體方法為:檢查某個應該存在的方法是否有效來決定是否需要初始化原型。
function Person(name){ this.name = name; this.friends = ["Bob","Harry"];//引用類型為實例屬性 //****ProtoType**** if(typeof this.sayName != "function"){ Person.prototype.sayName = function(){ console.log(this.name); }; } };1.8 寄生構造模式
構造函數(shù)在不反回值的情況下,默認會返回新對象實例。
而通過在函數(shù)末尾添加return語句,可以重寫new后調(diào)用函數(shù)時的返回值。
function Person(name){ var o = new Object(); o.name = name; o.sayName = function(){ console.log(this.name); }; return o; }; var person = new Person("Albert"); console.log(person instanceof Person);//false
該函數(shù)除了使用new操作符和把包裝函數(shù)取名叫“構造函數(shù)”以外,和工廠模式其實是一模一樣的。
該模式屬于比較特殊的構造模式,可用于不允許修改原對象的情況。
function SpecialArray(){ var values = new Array(); values.push.apply(values,arguments); values.toPipedString = function(){ return this.join("|"); }; return values }1.9 穩(wěn)妥(durable)構造函數(shù)模式
該模式構造出來的對象沒有公共屬性,不適用this對象,不適用new操作符,適用于在一些安全環(huán)境中,可防止數(shù)據(jù)被其它應用(如Mashup)改動(利用閉包特性),類似于寄生構造函數(shù)模式,單不適用this和new。
function Person(name){ var o = new Object(); //****定義私有變量和函數(shù)**** var _name = name; o.sayName = function(){ console.log(_name); }; return o; }; var person = Person("Albert");
這種模式中,除了sayName()方法以外,沒有其它辦法訪問_name的值。
文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/86914.html
摘要:對象的分類內(nèi)置對象原生對象就是語言預定義的對象,在標準定義,有解釋器引擎提供具體實現(xiàn)宿主對象指的是運行環(huán)境提供的對象。不過類型是中所有類型的父級所有類型的對象都可以使用的屬性和方法,可以通過的構造函數(shù)來創(chuàng)建自定義對象。 對象 javaScript中的對象,和其它編程語言中的對象一樣,可以比照現(xiàn)實生活中的對象來理解。在JavaScript中,一個對象可以是一個單獨擁有屬性和類型的實體。和...
摘要:對象對象是什么中的對象和其他編程語言中的對象一樣可以比照現(xiàn)實上活中的對象來理解它中對象的概念可以比照現(xiàn)實生活中實實在在的物體來理解在中一個對象可以是一個單獨的擁有屬性和類型的實體拿它和一個杯子做下類比一個杯子是一個對象擁有屬性杯子有顏色圖案 對象 對象是什么 JavaScript中的對象 和其他編程語言中的對象一樣 可以比照現(xiàn)實上活中的對象來理解它JavaScript中對象的概念可以比...
摘要:張無忌對象的屬性存在對象的屬性不存在使用進行判斷。張無忌對象的屬性存在請先定義對象的屬性使用語句進行判斷張無忌對象的屬性存在刪除對象的屬性可以用操作符刪除一個不是繼承而來的屬性。 對象 對象的概述 對象是什么 JavaScript中的對象,和其他編程語言中的對象一樣。可以對比現(xiàn)實生活中的一些東西來理解他。在JavaScript中,一個對象可以使一個單純的擁有屬性和類型的實體。假如和一個...
摘要:屬性名可以是包含空字符串在內(nèi)的任意字符串,但對象中不能存在兩個同名的屬性。客戶端中表示網(wǎng)頁結構的對象均是宿主對象。這里的函數(shù)稱做構造函數(shù),構造函數(shù)用以初始化一個新創(chuàng)建的對象。通過關鍵字和構造函數(shù)調(diào)用創(chuàng)建的對象的原型就是構造函數(shù)的屬性的值。 對象是 JavaScript 的數(shù)據(jù)類型。它將很多值(原始值或者其他對象)聚合在一起,可通過名字訪問這些值,因此我們可以把它看成是從字符串到值的映射...
摘要:都是構造函數(shù)模式創(chuàng)建的原生構造函數(shù)。使用構造函數(shù)創(chuàng)建對象經(jīng)歷了以下四個過程創(chuàng)建一個新對象構造函數(shù)的作用域交給新對象。 ??在創(chuàng)建對象的時候,使用對象字面量和 new Object() 構造函數(shù)的方式創(chuàng)建一個對象是最簡單最方便的方式。但是凡是處于初級階段的事物都會不可避免的存在一個問題,沒有普適性,意思就是說我要為世界上(程序中)的所有使用到的對象都使用一遍 var xxx = {} ,...
摘要:都是構造函數(shù)模式創(chuàng)建的原生構造函數(shù)。使用構造函數(shù)創(chuàng)建對象經(jīng)歷了以下四個過程創(chuàng)建一個新對象構造函數(shù)的作用域交給新對象。 ??在創(chuàng)建對象的時候,使用對象字面量和 new Object() 構造函數(shù)的方式創(chuàng)建一個對象是最簡單最方便的方式。但是凡是處于初級階段的事物都會不可避免的存在一個問題,沒有普適性,意思就是說我要為世界上(程序中)的所有使用到的對象都使用一遍 var xxx = {} ,...
閱讀 1311·2021-11-24 10:24
閱讀 4089·2021-11-22 15:29
閱讀 1085·2019-08-30 15:53
閱讀 2788·2019-08-30 10:54
閱讀 1977·2019-08-29 17:26
閱讀 1271·2019-08-29 17:08
閱讀 605·2019-08-28 17:55
閱讀 1576·2019-08-26 14:01