詳解js產(chǎn)生對象的3種基本方式(工廠模式,構(gòu)造函數(shù)模式,原型模式)
1.工廠模式
工廠模式是軟件工程領(lǐng)域一種廣為人知的設(shè)計模式,而由于在ECMAScript中無法創(chuàng)建類,因此用函數(shù)封裝以特定接口創(chuàng)建對象。其實現(xiàn)方法非常簡單,也就是在函數(shù)內(nèi)創(chuàng)建一個對象,給對象賦予屬性及方法再將對象返回即可。
function a(name){
var b = new object();
b.name = name;
b.say = function(){
alert(this.name);
}
return b
}
函數(shù)內(nèi)部產(chǎn)生b對象并返回。
2.構(gòu)造函數(shù)模式
function Person(name, url) { //注意構(gòu)造函數(shù)名第一個字母大寫
this.name = name;
this.url = url;
this.alertUrl = alertUrl;
}
function alertUrl() {
alert(this.url);
}
因為每構(gòu)造一個對象就會生成一個alertUrl方法,這樣太浪費資源空間,所以把alertUrl這個方法寫在全局以節(jié)省空間,但這樣寫就違背了面向?qū)ο缶幊痰某踔裕旅娴脑湍J骄透靡恍?/p>
3.原型模式
我們創(chuàng)建的每個函數(shù)都有prototype(原型)屬性,這個屬性是一個指針,指向一個對象,而這個對象的用途是包含可以由特定類型的所有實例共享的屬性和方法。使用原型對象的好處就是可以讓所有對象實例共享它所包含的屬性及方法。
function Person(){
}
Person.prototype.name = "bill";
Person.prototype.address = "GuangZhou";
Person.sayName = function (){
alert(this.name);
}
var person1 = new Person();
var person2 = new Person();
//測試代碼
alert(person1.name); // bill
alert(person2.name); // bill
person1.sayName(); //bill
person2.sayName(); //bill
person1.name = "666";
alert(person1.name); // 666
alert(person2.name); // bill
person1.sayName(); //666
person2.sayName(); //bill
我們創(chuàng)建的每個函數(shù)都有prototype(原型)屬性,這個屬性其實是一個指針,指向一個對象。
當構(gòu)造一個person對象例如person1之后,它的默認name屬性就是bill。如果要改name值的話就要對person1.name操作。這只是改了這個對象的name屬性。alert(person1.prototype.name)依然是彈出bill,即原型上的name屬性
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
淺談javascript中的prototype和__proto__的理解
這篇文章主要介紹了淺談javascript中的prototype和__proto__的理解,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
JS實現(xiàn)仿雅虎首頁快捷登錄入口及導(dǎo)航模塊效果
這篇文章主要介紹了JS實現(xiàn)仿雅虎首頁快捷登錄入口及導(dǎo)航模塊效果,涉及JavaScript響應(yīng)鼠標事件遍歷頁面元素的實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09

