제3장 폐쇄와 고급 함수
제3장 폐쇄와 고급 함수
3.1 패키지 닫기
3.1.1 변수의 작용역
3.1.2 변수의 생존주기
var Type = {};
for(var i = 0, type; type = ['String','Array','Number'][i++];){
(function(type){
Type['is'+type] = function(obj){
return Object.prototype.toString.call(obj) === '[object '+type+']';
}
})(type)
}
var a = Type.isArray([]);//true
var b = Type.isString('str');//true
console.log(a);
console.log(b);
3.1.3 폐쇄의 더 많은 역할
1 패키지 변수var mult = (function(){
var cache = {};
var calculate = function(){
for(var i = 0, l = arguments.length; i<1; i++){
a = a*arguments[i];
}
return a;
};
return function(){
var args = Array.pototype.join.call(arguments,',');
if(args in cache){
return cache[args];
}
return cache[args] = calculate.apply(null,arguments);
}
})()
2 국부 변수의 수명 연장
3.1.4 패키지 및 대상 설계
var extent = function(){
var value = 0;
return {
call : function(){
value++;
console.log(value);
}
}
}
var extent = extent();
extent.call();
extent.call();
extent.call();
//
var extent = {
value:0,
call:function(){
this.value++;
console.log(this.value);
}
}
extent.call();//1
extent.call();//2
extent.call();//3
//
var Exent = function(){
this.value = 0;
}
Exent.prototype.call = function(){
this.value+;
console.log(this.value);
}
var extent = new Exent;
extent.call();//1
extent.call();//2
extent.call();//3
3.1.5 클러치로 명령 모드 구현
Document
var Tv = {
open:function(){
console.log(" ");
},
close:function(){
console.log(" ")
}
};
var OpenTvCommand = function(receiver){
this.receiver = receiver;
}
OpenTvCommand.prototype.execute = function(){
this.receiver.open();
}
OpenTvCommand.prototype.undo = function(receiver){
this.receiver.close();
}
var setCommand = function(command){
document.getElementById('execute').onclick = function(){
command.execute();
}
document.getElementById('undo').onclick = function(){
command.undo();
}
};
setCommand(new OpenTvCommand(Tv));
// , ( )
패키지 버전var Tv = {
open:function(){
console.log(' ');
},
close:function(){
console.log(' ');
}
};
var createCommand = function(receiver){
var execute = function(){
return receiver.open();
}
var undo = function(){
return receiver.close();
}
return {
execute:execute,
undo:undo
}
};
var setCommand = function(command){
document.getElementById('execute').onclick = function(){
command.execute();
}
document.getElementById('undo').onclick = function(){
command.undo();
}
};
setCommand(createCommand(Tv));
3.1.3 클로즈업 및 메모리 관리
C++ COM 객체로 BOM 및 DOM COM 객체의 스팸 수집 메커니즘은 참조 계수 정책을 사용합니다.
순환 인용 중인 변수를null로 설정
3.2 고급 함수
3.2.1 함수를 매개 변수로 전달
1 콜백 함수var appendDiv = function(){
for(var i = 0; i<100; i++){
var div = document.createElement('div');
div.innerHTML = i;
document.body.appendChild(div);
if(typeof callback === 'function'){
callback(div);
}
}
}
appendDiv(function(){
node.style.display = 'none'
});
2Array.prototype.sort [1,4,3].sort(function(a,b){
return a-b;
}) //[1,3,4]
[1,4,3].sort(function(a,b){
return b-a;
}) //[4,3,1]
3.2.2 함수를 반환값으로 출력
1 데이터의 유형 판단var isType = function(type) {
return function(obj){
return Object.prototype.toString.call(obj) ==='[object ' + type+']';
}
}
var isString = isType('Sting');
var isArray = isType('Array');
var isNumber = isType('Number');
console.log(isArray([1,2,3])); //true
2getSingle var getSingle = function(fn){
var ret;
return function(){
return ret || (ret = fn.apply(this,arguments))
}
}
var getSingle = getSingle(function(){
return document.createElement('script');
})
var script1 = getSingle();
var script2 = getSingle();
console.log(script1===script2);
3.2.3 고급 함수 AOP 구현
Function.prototype.before = function(beforefn){
var _self = this;
return function(){
beforefn.apply(this,arguments);
return _self.apply(this,arguments);
}
}
Function.prototype.after = function(afterfn){
var _self = this;
return function(){
var ret = _self.apply(this,arguments);
afterfn.apply(this,arguments);
return ret;
}
};
var func = function(){
console.log(2);
}
func = func.before(function(){
console.log(1);
}).after(function(){
console.log(3);
});
func();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSON
JSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다.
그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다.
저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
var Type = {};
for(var i = 0, type; type = ['String','Array','Number'][i++];){
(function(type){
Type['is'+type] = function(obj){
return Object.prototype.toString.call(obj) === '[object '+type+']';
}
})(type)
}
var a = Type.isArray([]);//true
var b = Type.isString('str');//true
console.log(a);
console.log(b);
var mult = (function(){
var cache = {};
var calculate = function(){
for(var i = 0, l = arguments.length; i<1; i++){
a = a*arguments[i];
}
return a;
};
return function(){
var args = Array.pototype.join.call(arguments,',');
if(args in cache){
return cache[args];
}
return cache[args] = calculate.apply(null,arguments);
}
})()
var extent = function(){
var value = 0;
return {
call : function(){
value++;
console.log(value);
}
}
}
var extent = extent();
extent.call();
extent.call();
extent.call();
//
var extent = {
value:0,
call:function(){
this.value++;
console.log(this.value);
}
}
extent.call();//1
extent.call();//2
extent.call();//3
//
var Exent = function(){
this.value = 0;
}
Exent.prototype.call = function(){
this.value+;
console.log(this.value);
}
var extent = new Exent;
extent.call();//1
extent.call();//2
extent.call();//3
Document
var Tv = {
open:function(){
console.log(" ");
},
close:function(){
console.log(" ")
}
};
var OpenTvCommand = function(receiver){
this.receiver = receiver;
}
OpenTvCommand.prototype.execute = function(){
this.receiver.open();
}
OpenTvCommand.prototype.undo = function(receiver){
this.receiver.close();
}
var setCommand = function(command){
document.getElementById('execute').onclick = function(){
command.execute();
}
document.getElementById('undo').onclick = function(){
command.undo();
}
};
setCommand(new OpenTvCommand(Tv));
// , ( )
var Tv = {
open:function(){
console.log(' ');
},
close:function(){
console.log(' ');
}
};
var createCommand = function(receiver){
var execute = function(){
return receiver.open();
}
var undo = function(){
return receiver.close();
}
return {
execute:execute,
undo:undo
}
};
var setCommand = function(command){
document.getElementById('execute').onclick = function(){
command.execute();
}
document.getElementById('undo').onclick = function(){
command.undo();
}
};
setCommand(createCommand(Tv));
var appendDiv = function(){
for(var i = 0; i<100; i++){
var div = document.createElement('div');
div.innerHTML = i;
document.body.appendChild(div);
if(typeof callback === 'function'){
callback(div);
}
}
}
appendDiv(function(){
node.style.display = 'none'
});
[1,4,3].sort(function(a,b){
return a-b;
}) //[1,3,4]
[1,4,3].sort(function(a,b){
return b-a;
}) //[4,3,1]
var isType = function(type) {
return function(obj){
return Object.prototype.toString.call(obj) ==='[object ' + type+']';
}
}
var isString = isType('Sting');
var isArray = isType('Array');
var isNumber = isType('Number');
console.log(isArray([1,2,3])); //true
var getSingle = function(fn){
var ret;
return function(){
return ret || (ret = fn.apply(this,arguments))
}
}
var getSingle = getSingle(function(){
return document.createElement('script');
})
var script1 = getSingle();
var script2 = getSingle();
console.log(script1===script2);
Function.prototype.before = function(beforefn){
var _self = this;
return function(){
beforefn.apply(this,arguments);
return _self.apply(this,arguments);
}
}
Function.prototype.after = function(afterfn){
var _self = this;
return function(){
var ret = _self.apply(this,arguments);
afterfn.apply(this,arguments);
return ret;
}
};
var func = function(){
console.log(2);
}
func = func.before(function(){
console.log(1);
}).after(function(){
console.log(3);
});
func();
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.