js設計模式精講系列

很久沒逛園子了，忙於工作，閑話少說，進入正題。

1：構造模式(Constructor Pattern)

先講下js對象的3中創建方式:

var newObj = {};

var newObj = Object.create(null);

var newObj = new Object();

常用的是第一種和第三種。

接着講下給對象添加屬性和方法的四種方法:

1.Dot語法 即通過“.”點號添加
給對象添加屬性和值
newObj.someKey ="Hello javascript! i love u";
獲取屬性值
var key = newObj.someKey;
2.方括號語法
newObj["someKey"] = "this is the second method!";
var key = newObj["someKey"];
這兩種是比較普遍的做法，ECMAScript3 編譯通過
3.Object.defineProperty
Object.defineProperty(newObj,"someKey",{
      value:"好處在於可以對屬性做更多的行為動作",
       writeable:true,
       enumerable:true,
       configurable:true
});
一種更通俗易懂的簡單寫法
var defineProp = function ( obj, key, value ){
  config.value = value;
  Object.defineProperty( obj, key, config );
};
使用這種方式，我們創建一個空person 對象
var person = Object.create(null);
defineProp(person,"car","BMW");
defineProp(person,"dateOfBirth","1988");
defineProp(person,"hasbeard",true);
等等
4.Object.defineProperties
如果說剛才只能設置一個屬性,這個可以設置多個屬性，請看下面
Object.defineProperty(newObj,{
      "someKey":｛
             value:"這是一些屬性",
             writeable:true},
       "anotherKey":{
             value:"這是另外一 些屬性",
             writeable:true}
});
說明：3，4在ECMAScript5下編譯通過
可以用1或2的方式獲取3或4屬性或者方法，改成方法例子把 value:function(args){} 即可

使用這些方法能夠用來繼承，我們來做個小實驗，看如下代碼：

創建一個賽車手，繼承上面的person對象
var driver = Object.create(person);
添加一些新的屬性或方法
defineProp(driver,"topSpeed","100mph");
我們輸出日志看下是否繼承了person的屬性
console.log(driver.dateOfBirth);
//output:1988
在重新獲取新設置的屬性
console.log(driver.topSpeed);
//output:100mph

上面這些例子也告訴我們Js 沒有class的概念，但是支持Object特殊的構造函數,通過簡單地加前綴使用關鍵字“new”調用構造函數,我們可以告訴JavaScript我們希望用函數來表現得像一個構造函數、實例化一個新的對象與成員定義的函數。

簡單的介紹后，我們來看基本的構造器模式的寫法，如下：

function Car( model, year, miles ) {

  this.model = model;
  this.year = year;
  this.miles = miles;

}
//注意這里我們使用obj.protorype.newMethod 而不是Object.prototype是為了避免重定義原型對象
Car.prototype.toString = function () {
  return this.model + " has done " + this.miles + " miles";
};

// 用法:

var civic = new Car( "Honda Civic", 2009, 20000 );
var mondeo = new Car( "Ford Mondeo", 2010, 5000 );

console.log( civic.toString() );
console.log( mondeo.toString() );

上面的ToString()的單實例，保證每台Car都能共用這個方法。這里就是一個簡單的構造器模式。

下章講解：模塊化模式