javascript工廠方式定義物件_基礎知識

每個函數物件都有一個length屬性，表示該函數期望接收的參數個數。

複製程式碼 程式碼如下:

關於js物件導向的創建方式,

目標:

建構一個order物件.
包含三個屬性:日期,金額,提交者 
包含一個方法:顯示字串:”XX在XXXX-XX-XX 提交了額度為:XXXX元的訂單"

一 工廠方式

複製程式碼 程式碼如下:

        

二 建構函式方式

複製程式碼 程式碼如下:

/*
     建構函數方式,方法的聲明與工廠方式一樣,也存在同同樣的問題,同樣可以提取出來.不同點是聲明屬性用this
    並且需要使用new運算子產生實例.
*/
function Order()
{
     this.Date = "1990-1-1";
     this.Price = "3200";
     this.Name = "Vince Keny";
     this.Show = function()
         {
              alert(this.Name " 在 " this.Date " 提交了額度為 " this.Price " 元的訂單.")
         }
}
 
var order = new Order();
order.Show();

三 原型方式

複製程式碼 程式碼如下:

/*
     原型方式:使用prototype
*/
function Order()
{}
 
Order.prototype.Date = "1990-1-1";
Order.prototype.Price = "3200";
Order.prototype.Name = "Vince Keny";
Order.prototype.Show = function()
     {
         alert(this.Name " 在 " this.Date " 提交了額度為 " this.Price " 元的訂單.")
     }
var order = new Order();
order.Show();

四 混合 建構子/原型 方式

複製程式碼 程式碼如下:

/*
     混合建構子/原型 方式 : 使用建構子方式初始化屬性欄位,使用原型方式建構方法.
*/
function Order()
{
     this.Date = "1990-1-1";
     this.Price = "3200";
     this.Name = "Vince Keny";
}
Order.prototype.Show = function().
{
         alert(this.Name " 在 " this.Date " 提交了額度為 " this.Price " 元的訂單.")
}
var order = new Order();
order.Show();

五 動態混合方式

複製程式碼 程式碼如下:

/*
     動態混合方式 : 和混合方式不同點在於宣告方法的位置.將方法生命放到了構造函數內部,更符合物件導向.
*/
function Order()
{
     this.Date = "1990-1-1";
     this.Price = "3200";
     this.Name = "Vince Keny";
   
     if(typeof Order._initialized == "undefined")
     {
         Order.prototype.Show = function().
                       {
                            alert(this.Name " 在 " this.Date " 提交了額度為 " this.Price ">                        };
         Order._initialized = true;
     }
}
    function Car(sColor,iDoors){

        var oTempCar = new Object;
        oTempCar.color = sColor;
        oTempCar.doors = iDooes;
        oTempCar.showColor = function (){
            alert(this.color)
        };
        return oTempCar;
    }
    var oCar1 = new Car("red",4);
    var oCar2 = new Car("blue",3);
    oCar1.showColor();        //outputs "red"
    oCar2.showColor();        //outputs "blue"