模組是一個提供介面而隱藏狀態和實作的函數或物件。
一般形式:一個定義了私有變數和函數的函數;利用閉包創造可以存取私有變數和函數的特權函數;最後傳回這個特權函數,或是把他們儲存到一個可以被存取到的地方。
Function.prototype.method = function(name,func){ this.prototype[name] = func; return this; }; String.method("deentityify",function(){ var entity = { quot : '"', lt : '<', gt : '>' }; return function(){ return this.replace(/&([^&;]+);/g, function(a, b){ // 怎样知道a、b的值,了解正则表达式 var r = entity[b]; return typeof r === "string" ? r : a; }); }; }()); alert("<">".deentityify()); // 测试:<">
註:模組模式通常結合單例模式使用,JavaScript的單例模式就是用對象字面量方式創建的對象,對象的屬性值可以是數值或函數,並且屬性值在該對象的生命週期中不會改變。
級聯(鍊式操作)
對於一些不回傳值的方法,我們返回this,而不是undefined,那麼我們就可以啟動以級聯(鍊式)去操作該物件。如下:
var $ = function(id){ var obj = document.getElementById(id); obj.setColor = function(color){ this.style.color = color; return this; }; obj.setBgColor = function(color){ this.style.backgroundColor = color; return this; // 返回this对象,启动级联 }; obj.setFontSize = function(size){ this.style.fontSize = size; return this; }; return obj; }; $("test").setColor("red") .setFontSize("30px") .setBgColor("blue"); // 改进后的代码: (function(id){ var _$ = function(id){ this.element = document.getElementById(id); }; _$.prototype = { setColor : function(color){ this.element.style.color = color; return this; }, setBgColor : function(color){ this.element.style.backgroundColor = color; return this; }, setFontSize : function(size){ this.element.style.fontSize = size; return this; } }; // 添加到window原型链中 window.$ = function(id){ return new _$(id); }; })(); $("test").setColor("red") .setFontSize("30px") .setBgColor("blue");
套用
所謂套用就是將函數與傳遞給它的參數結合,產生一個新的函數。如:在下面程式碼中定義一個add()函數,該函數能夠傳回一個新的函數,並將參數值傳遞給這個新函數,從而實現連加操作。
// 第一种方式: var add = function(a){ return function(b){ return a + b; } }; alert(add(1)(2)); // 3 // 第二种方式:用arguments实现 var add = function(){ var arg = arguments; return function(){ var sum = 0; for(var i=0; i<arg.length; i++){ sum += arg[i]; } for(i=0; i<arguments.length; i++){ sum += arguments[i]; } return sum; } }; alert(add(1,2,3)(4,5,6)); // 21 // 第三种方式:通过一个套用方法(curry)实现 var add = function(){ var sum = 0; for(var i=0; i<arguments.length; i++){ sum += arguments[i]; } return sum; }; // 添加方法到Function的原型链上 Function.prototype.method = function(name, func){ this.prototype[name] = func; return this; }; // 套用方法 Function.method('curry', function(){ // 通过数组Array的slice方法,使得arguments也具有concat方法 var slice = Array.prototype.slice, args = slice.apply(arguments), that = this; return function(){ return that.apply(null, args.concat(slice.apply(arguments))); }; }); alert(add.curry(1,2)(3,4)); // 10
記憶
函數可以用物件去記住先前運算的結果,以便避免無謂的運算。這種最佳化被稱為記憶。
var fibonacci = function(){ var mome = [0,1]; // 存放计算后的数据 var fib = function(n){ var result = mome[n]; // 如果不存在被计算过的数据,则直接计算。然后在将计算结果缓存 if(typeof result !== 'number'){ result = fib(n-1) + fib(n-2); mome[n] = result; } return result; }; return fib; }(); for(var i=0; i<=10; i++){ document.writeln("// " + i + ": " + fibonacci(i) + "<br/>"); } //========================== // 创建一个具有记忆的函数 //========================== var memoizer = function(memo, fundamental){ var shell = function(n){ var result = memo[n]; if(typeof result !== "number"){ result = fundamental(shell, n); memo[n] = result; } return result; }; return shell; }; // 通过记忆函数memoizer完成斐波那契数列 var fibonacci = memoizer([0,1], function(shell, n){ return shell(n-1) + shell(n-2); }); // 通过记忆函数memoizer完成阶乘 var factorial = memoizer([1,1], function(shell, n){ return n * shell(n-1); }); for(var i=0; i<=15; i++){ document.writeln("// " + i + ": " + factorial(i) + "<br/>"); }
以上是javascript函數模組、級聯、套用、記憶用法實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!