switch 模式java
parseInt(year, 10)
)1.對象直接量,JSON,正則表達式直接量
1.強制new,避免使用其餘的內置構造函數:String()、Number()、Boolean()以及不一樣種類的
Error()構造器,that=thisgit
命名空間方式github
優勢:ajax
缺點正則表達式
模塊模式(命名空間模式+IIFE+私有和特權成員模式+依賴聲明模式)算法
MYAPP.utilities.module = (function (app, global) { return (function(){})() }(MYAPP, this))
沙箱模式segmentfault
Sandbox.modules = {}; Sandbox.modules.dom = function (box) {}; Sandbox('dom', 'event', function (box) { Sandbox('ajax', function(box) { }); });
鏈式調用模式設計模式
缺點:調用這樣寫的代碼會更困難瀏覽器
myobj.method1("hello").method2().method3("world").method4();
代碼複用模式緩存
類式繼承1:默認模式
缺點:既繼承了(父對象)「本身的屬性」,也繼承了原型中的屬性。大部分狀況下你可能並不須要「本身的屬性」,由於它們更多是爲實例對象添加的,並不用於複用。
function inherit(C, P) { C.prototype = new P(); }
類式繼承2:借用構造函數
缺點:沒法繼承原型
function Child(a, c, b, d) { Parent.apply(this, arguments); }
類式繼承3:借用並設置原型(1,2的缺點修復,接近java)
缺點:父構造函數被調用了兩次,因此不是很高效
function Child(a, c, b, d) { Parent.apply(this, arguments); } Child.prototype = new Parent();
類式繼承4:共享原型
缺點:修改原型影響全部的繼承
function inherit(C, P) { C.prototype = P.prototype; }
類式繼承5:臨時構造函數
function inherit(C, P) { var F = function () {}; F.prototype = P.prototype; C.prototype = new F(); }
原型繼承(現代繼承模式)
var child = Object.create(parent);
借用方法
//call() example notmyobj.doStuff.call(myobj, param1, p2, p3); // apply() example notmyobj.doStuff.apply(myobj, [param1, p2, p3]);
var obj = { myprop: 'my value' };
var corolla = CarMaker.factory('Compact'); var solstice = CarMaker.factory('Convertible'); var cherokee = CarMaker.factory('SUV'); corolla.drive(); // "Vroom, I have 4 doors" solstice.drive(); // "Vroom, I have 2 doors" cherokee.drive(); // "Vroom, I have 17 doors"
var element; while (element = agg.next()) { // do something with the element ... console.log(element); }
var sale = new Sale(100); // the price is 100 dollars sale = sale.decorate('fedtax'); // add federal tax sale = sale.decorate('cdn'); // format using CDN sale.getPrice(); // "CDN$ 105.00"
var data = { first_name: "Super", last_name: "Man", age: "unknown", username: "o_O" }; validator.config = { first_name: 'isNonEmpty', age: 'isNumber', username: 'isAlphaNum' }; validator.validate(data); if (validator.hasErrors()) { console.log(validator.messages.join("\n")); }
var myevent = { // ... stop: function (e) { // others if (typeof e.preventDefault === "function") e.preventDefault(); if (typeof e.stopPropagation === "function") e.stopPropagation(); // IE if (typeof e.returnValue === "boolean") e.returnValue = false; if (typeof e.cancelBubble === "boolean") e.cancelBubble = true; } // ... };
scroll_per_second=throttle(scroll,1000)
counter=function(){ var i=0; return function(){ return ++i; } } counter()
paper.subscribe(joe.drinkCoffee); paper.subscribe(joe.sundayPreNap, 'monthly'); paper.daily(); paper.monthly();
減小DOM訪問操做次數
事件處理:隔離應用邏輯,不要分發event對象
var MyApplication={ handleClick(event){ this.showPopup(event.clientX,event.clientY) }, showPopup:function(x,y){ } } b.addEventListener('click', function(event){ MyApplication.handleClick(event) }, false);
事件委託
Y.delegate('click', myHandler, "#click-wrap", "button");
加載策略
重構目的:改進軟件設計,使軟件更容易理解,幫助找到bug,提升產出。
重構法則:事不過三,三則重構。添加功能/修補錯誤/複審代碼時重構,重構不如重寫簡單、項目的最後期限,應該避免重構。
糟糕代碼:
重構建議:
從新組織函數
在對象之間搬移特性
從新組織數據
簡化條件表達式
簡化函數調用
處理歸納關係
大型重構
《Javascript設計模式》
《編寫可維護的Javascript》
《重構——改善既有代碼的設計》
《代碼大全2》
Design-Patterns-in-Javascript