모듈은 인터페이스를 제공하지만 상태와 구현을 숨기는 함수 또는 개체입니다.
일반 형식: 비공개 변수 및 함수를 정의하는 함수입니다. 비공개 변수 및 함수에 액세스할 수 있는 권한 있는 함수를 생성합니다. 최종적으로 이 권한 있는 함수를 반환하거나 액세스할 수 있는 위치에 저장합니다.
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의 싱글턴 패턴은 객체 리터럴을 사용하여 생성된 객체입니다. 객체의 속성 값은 숫자 값이거나 함수일 수 있지만 속성 값은 그렇지 않습니다. 객체의 수명주기 동안 존재합니다. 변경이 발생합니다.
계단식(연쇄 작업)
값을 반환하지 않는 일부 메서드의 경우 정의되지 않은 대신 이를 반환한 다음 객체에 대해 계단식(연쇄) 작업을 시작할 수 있습니다.
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");
Apply
소위 애플리케이션은 전달된 매개변수와 함수를 결합하여 새로운 함수를 생성하는 것입니다. 예: 다음 코드는 새 함수를 반환하고 매개변수 값을 새 함수에 전달하여 지속적인 추가 작업을 수행할 수 있는 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
Memory
함수는 객체를 사용하여 이전 작업의 결과를 기억함으로써 불필요한 작업을 피할 수 있습니다. 이러한 최적화를 암기라고 합니다.
위 내용은 자바스크립트 함수 모듈, 캐스케이딩, 애플리케이션, 메모리 사용 예시에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!