JavaScript 클로저 예제 explain_javascript 기술-JS 튜토리얼-php.cn

JavaScript 클로저 예제 explain_javascript 기술

WBOY

풀어 주다： 2016-05-16 16:51:42

원래의

1017명이 탐색했습니다.

이것의 이점은 내부 함수가 정의된 외부 함수의 매개변수와 변수에 액세스할 수 있다는 것입니다.

먼저 간단한 객체를 만들어 보겠습니다.

코드 복사 코드는 다음과 같습니다.

var testObj = {
값: 10,
추가: function(inc){
this.value = (typeof inc === "number") ? inc : 1;
}
};

testObj.add();
testObj.value // 11

testObj.add(2);
testObj.value; // 13

이렇게 작성하면 값이 불법적으로 수정되지 않는다는 문제가 있습니다. 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

var testObj = (function(){
var value = 10;
return {
add: function(inc){
value = (typeof inc === "number") ? inc : 1;
},
getValue: 함수(){
반환 값;
testObj.add();
testObj.getValue() // 11
testObj.add(2);

testObj.getValue(); // 13

일반적으로 testObj를 초기화하는 함수를 호출할 수 있습니다. 이 함수는 함수 A 값을 반환합니다. 변수는 여기에 정의되어 있으며 add 및 getValue 메소드에서 항상 사용할 수 있지만 함수 범위로 인해 다른 프로그램에서는 볼 수 없습니다. 동시에 내부 기능이 외부 기능보다 수명 주기가 더 길다는 결론도 내릴 수 있습니다.

계속해서 생성자 호출의 예를 살펴보겠습니다.

코드 복사

코드는 다음과 같습니다.var MyObj = function(str){ this .status = str;

};

MyObj.prototype.getStatus = function(){
return this.status;
};

var obj = new MyObj("javascript");
obj.getStatus(); // "javascript"

이 글을 작성하는 데에는 문제가 없지만 약간 "불필요합니다" ", 왜요? 직접 액세스할 수 있는 속성에 액세스하기 위해 getStatus 메서드를 사용하는 것은 어떻습니까? 물론 이는 지위가 사유 재산인 경우에만 의미가 있습니다.

코드 복사

코드는 다음과 같습니다.var obj = function(status){ 반환 {

getStatus: function(){

반환 상태;
}
};
};

var myObj = obj("javascript");
myObj.getStatus(); // "javascript"
여기서 obj를 호출하면 getStatus 메소드를 포함하는 새 객체가 반환됩니다. 객체에 대한 참조는 myObj에 저장됩니다. obj가 반환된 경우에도 getStatus 메소드는 여전히 obj 객체의 상태 속성에 액세스하는 특권을 누리고 있습니다. getStatus 메소드는 매개변수 사본에 액세스하지 않고 매개변수 자체에 액세스합니다. 이는 함수가 자신이 생성된 컨텍스트에 액세스할 수 있기 때문에 가능하며, 이를 클로저라고 합니다.