Learning JavaScript Design Patterns 說明許多javascript模式，在此作些筆記。
由於
Javascript是個有「洞」的語言，因此試圖去理解別人寫的javascript程式碼，無疑是給自己找麻煩，而自己寫javascript若沒有採用好的模式，將來作維護時，也很容易就發生看不懂的狀況。因此，寫 javascript 之前，先了解可用的模式，是「初學者」必需要作的第一步。當然，直接看模式對初學者來說，會比較辛苦些，但至少看過一遍後，寫的程式比較有機會將來可以維護。以前作大型專案時，若前端用很多javascript，在作程式改版或維護時，至少80%就是打掉重寫! 跟 Java 比，javascript困難太多了。
由於該書的程式碼用長名稱，使得模式的「樣子」不易一眼看出來，所以將此書中的模式，用較短命名重寫，重點是方便一眼看出模式的樣子，實際命名時還是要注意使用常用的命名方式。
What is a Pattern? 什麼是模式
- Patterns are proven solutions 模式已驗證可提供解決方案
- Patterns can be easily reused 模式易於理解
- Patterns can be expressive 模式易於表達
The Constructor Pattern
// 1. Object Creation
var a = {};
var a = Object.create( Object.prototype );
var a = new Object();
// Object keys and values
// 2.1 dot
a.k = "v";
var value = a.k;
// 2.2 Square bracket
a["k"] = "v";
var value = a["k"];
// 2.3 Object.defineProperty
Object.defineProperty( a, "k", {
value: "v",
writable: true,
enumerable: true,
configurable: true
});
// 2.4 Object.defineProperties
Object.defineProperties( a, {
"k": { value: "v", writable: true },
"l": { value: "w", writable: false}
});
// 3 Basic Constructors
function A(i, j) {
this.i = i;
this.j = j;
this.total = function () { return this.i + this.j; };
this.max = function () { return Math.Max(this.i, this.j); };
}
// 4 Constructors With Prototypes
function A(i, j) {
this.i = i;
this.j = j;
}
A.prototype.total = function () { return this.i + this.j; };
A.prototype.max = function () { return Math.Max(this.i, this.j); };
The Module Pattern
// Object Literals
var a = {
k: "v",
f: function () { return k; }
};
// The Module Pattern
var a = (function () {
var k = "v";
function up() { k = k.toUpperCase(); }
return {
publicK: "value",
getK: function () { return k; },
setK: function (value) { k = value; },
getUpK: function () { up(); return k; }
};
})();
// Import mixins
var a = (function (b, c) {
var k = "v";
function up() { k = k.toUpperCase() + b + c; }
return {
publicK: "value",
getKBC: function () { return k + b + c; },
setK: function (value) { k = value; },
getUpK: function () { up(); return k; },
};
})(b ,c);
// Exports
var a = (function () {
var b = {};
var k = "v";
function up() { k = k.toUpperCase(); }
b.publicK = "value";
b.getK = function () { return k; };
b.setK = function (value) { k = value; };
b.getUpK = function () { up(); return k; }
return b;
})();
The Singleton Pattern
var singleton = (function () {
var instance;
function init() {
var k = "v";
function privateM(){ /* ... */ }
return {
publicK: "public",
publicM: function () { privateM(); }
};
};
return {
getInstance: function () {
if ( !instance ) { instance = init(); }
return instance;
}
};
})();
