- 相關(guān)推薦
javascript工廠(chǎng)方式的使用
一、 工廠(chǎng)方式
自己的理解：要創(chuàng )建很多個(gè)對象的實(shí)例，這些實(shí)例有相同的屬性，但是有不同的屬性值。這個(gè)時(shí)候就需要創(chuàng )個(gè)工廠(chǎng)函數（factory function）。
工廠(chǎng)函數（factory function）：創(chuàng )建并返回特定類(lèi)型的對象。
工廠(chǎng)函數中如果一個(gè)屬性是方法的話(huà)，可以在工廠(chǎng)函數的外面定義對象的方法，然后通過(guò)屬性指向該方法，從而可以避開(kāi)每次都調用自己的屬性方法，這樣做使得每個(gè)對象都共享了同一個(gè)函數。
示例：
復制代碼 代碼如下:
//工廠(chǎng)函數外面定義對象的方法
function ShowNameFn() {
alert(this.Name);
}
//工廠(chǎng)方式創(chuàng )建對象
function CreatBOFn(sName, iAge, bSex) {
var BO = new Object();
BO.Name = sName;
BO.Age = iAge;
BO.Sex = bSex;
BO.ShowName = ShowNameFn; //該屬性實(shí)際上是指向函數的指針，是一個(gè)方法
return BO;
}
//按鈕測試調用
function FactoryCreateFn() {
var oPerson1 = CreatBOFn("張三", 18, true); //創(chuàng )建實(shí)例實(shí)際上是直接調用方法
oPerson1.ShowName();
}
總結：工廠(chǎng)函數這種方式定義類(lèi)或對象，他在創(chuàng )建實(shí)例的時(shí)候就調用這個(gè)工廠(chǎng)函數。
二、 構造函數方式
第一步選擇類(lèi)名，即構造函數的名字，BO名首字母大寫(xiě)，看下面代碼發(fā)現跟上面的工廠(chǎng)函數類(lèi)似。
示例：
復制代碼 代碼如下:
//------第二種：構造函數方式--------------------------------
function Car(color, money) {
this.Color = color;
this.Money = money;
this.ShowMoney = function() {
alert(this.Money);
}
}
//按鈕調用測試
function NewCarFn() {
var Car1 = new Car("紅色", "23萬(wàn)RMB");
Car1.ShowMoney();
}
//----------------------------------------------------------
比較上一種工廠(chǎng)函數方式的區別：
�、� 構造函數內部沒(méi)有創(chuàng )建對象，而是使用this關(guān)鍵字。
�、� 使用new運算符調用構造函數。
三、 原型方式
利用對象的prototype屬性，可以把他看成創(chuàng )建新對象所依賴(lài)的原型，用空構造函數來(lái)設置類(lèi)名，然后所有的屬性和方法都被直接賦予prototype屬性。
原型方式的問(wèn)題：
首先，這個(gè)構造函數沒(méi)有參數，使用原型方式時(shí)，不能通過(guò)給構造函數傳遞參數初始化屬性的值。必須在對象創(chuàng )建后才能改變屬性的默認值。
其次，當屬性指向的是對象，而不是函數時(shí)，對象卻被多個(gè)實(shí)例共享的，其中一個(gè)改變將引起其他對象的改變。
示例：
復制代碼 代碼如下:
//先定義一個(gè)空的構造函數
function Car() {
}
//屬性和方法直接賦予prototype屬性
Car.prototype.Color = "紅色，";
Car.prototype.Money = "20萬(wàn)";
Car.prototype.Drivers = new Array("小三", "小四");
var Car1 = new Car();
Car1.Drivers.push("小五"); //實(shí)例1中給對象Drivers新增了值(實(shí)際上就是在原型里面加了多了個(gè)“小五”,所以當new第二個(gè)對象的時(shí)候讀屬性Drivers也出現了小五)
alert(Car1.Drivers);
var Car2 = new Car();
alert(Car2.Drivers); //實(shí)例2中，對象中的值改變了！輸出“小三，小四，小五”
四、 混合的構造函數/原型方式
聯(lián)合使用構造函數和原型方式，就可以像其他語(yǔ)言一樣的創(chuàng )建對象。
構造函數定義對象的所有非函數屬性，原型方式定義對象的函數屬性（方法）。
示例：
復制代碼 代碼如下:
function BOStudent(name,age) {
this.姓名 = name;
this.年齡 = age;
this.課程 = new Array("語(yǔ)文","數學(xué)");
}
BOStudent.prototype.ShowName = function() {
alert(this.姓名);
};
//點(diǎn)擊按鈕調試
function Admixture() {
var stu1 = new BOStudent("張三", 20); //new第一個(gè)BO
var stu2 = new BOStudent("李四", 22); //new第二個(gè)BO
stu1.課程.push("物理"); //給對象1 添加物理課程項
alert(stu1.課程);
alert(stu2.課程);
}
混合的構造函數/原型方式是ECMAScript采用的主要方式，他具有其他方式的特性，卻沒(méi)有他們的副作用。
五、 動(dòng)態(tài)原型方法
大多數的面向對象語(yǔ)言，定義類(lèi)時(shí)，屬性和方法都打包在一起。而上面的混合構造函數/原型方式屬性和方法是分開(kāi)的，有些人認為在構造函數內部找屬性，在外面找方法的做法不合邏輯，因此也就產(chǎn)生了動(dòng)態(tài)原型方法。
區別在于：賦予對象的方法的位置不同。動(dòng)態(tài)原型方法是在構造函數的內部，而上面的第四種是在構造函數外部。
示例：
復制代碼 代碼如下:
function BODynamicPrototype(name, age) {
this.姓名 = name;
this.年齡 = age;
this.課程 = new Array("111", "222");
//_initialized標識判斷是否已經(jīng)初始化過(guò)，即是否已給原型賦予了任何方法，該方法只創(chuàng )建并賦值一次
if (typeof BODynamicPrototype._initialized == "undefined") {
BODynamicPrototype.prototype.ShowName = function() {
alert(this.姓名);
};
BODynamicPrototype._initialized = true;
}
}
//點(diǎn)擊按鈕調試
function DynamicPrototype() {
var stu1 = new BODynamicPrototype("aaa", 20); //new第一個(gè)BO
var stu2 = new BODynamicPrototype("bbb", 22); //new第二個(gè)BO
stu1.課程.push("333"); //給對象1 添加物理課程項
alert(stu1.課程);
alert(stu2.課程);
}
六、 混合工廠(chǎng)方式
目的是創(chuàng )建假構造函數，只返回另一種對象的新實(shí)例。這種方式在對象方法內部管理方面與經(jīng)典方式有著(zhù)相同的問(wèn)題。強烈建議：除非萬(wàn)不得已避免使用！
【javascript工廠(chǎng)方式的使用】相關(guān)文章：
詳解JavaScript中的splice()使用方法08-20
javascript中for/in循環(huán)以及常見(jiàn)的使用技巧06-24
Javascript中arguments對象的詳解和使用方法08-20
如何使用正確的發(fā)聲方式唱歌05-26
關(guān)于javascript對象之內置和對象Math的使用方法10-08
對javascript的理解08-08
常用的JavaScript模式09-22
Javascript的this用法簡(jiǎn)述08-15
JavaScript學(xué)習筆記08-24