Prototype 중첩 함수, 함수 클로저

황제낙엽 2008.08.12 14:25 조회 수 : 820 추천:98

sitelink1 http://자바 스크립트 for 웹2.0 - 오레일리 
sitelink2  
sitelink3  
sitelink4 http://1 
extra_vars4 ko 
extra_vars5  
extra_vars6 sitelink1 

1. 중첩함수의 형태

 

function outer (args) {   
    function inner (args) {   
        inner statements;   
    }   
}

 

2. 중첩함수의 기본 영역 규칙
안쪽 함수는 바깥쪽 함수의 영역 내에서만 동작하며, 바깥 함수의 변수와 인자에 접근할 수 있다.
하지만 바깥 함수는 안쪽 함수의 변수에 접근할 수 없고, 호출 프로그램 또한 안쪽 함수에 접근할 수 없다.

3. 중첩함수의 예외
기본규칙의 예외로써 함수 리터럴로 생성되고 호출 프로그램에 반환하는 경우는 예외다.

4. 중첩함수의 예외 예제 (클로저 예제)

 

 

<script type="text/javascript">
// 바깥쪽 함수   
function outerFunc(base) {   
    var punc = "!";   
    // 안쪽 함수   
    function returnString(ext) {   
        return base + ext + punc;   
    }   
    return returnString;   
}   
  
// 안쪽 함수로의 접근을 생성한다.   
var baseString = outerFunc("Hello ");   
안쪽 함수 리터럴을 변수로 받는다.   
이때 변수 base 에는 "Hello " 문자열을 할당한다.   
  
// 안쪽 함수는 여전히 바깥쪽 함수 인자에 접근할 수 있다.   
var newString = baseString("World");   
document.writeln(newString);   
함수포인터 baseString(안쪽 함수 리터럴)을 수행하고 결과를 newString에 대입하고 출력한다.   
이때 변수 ext 에 "World" 문자열을 할당하고, 이미 할당된 변수 base 값과 함께 출력한다.   
  
// 여기서도 마찬가지다.   
var notherString = baseString("Reader");   
document.writeln(notherString);   
다시 안쪽 함수 리터럴을 수행하고 결과를 출력한다.   
이때 변수 ext에 "Reader" 문자열을 할당하고, 이미 할당된 변수 base 값과 함께 출력한다.   
  
// 바깥쪽 함수의 실행 결과로 또다른 인스턴스를 생성한다.   
var anotherBase = outerFunc("Hiya, Hey ");   
이번엔 새로운 변수(anotherBase)에 바깥쪽 함수 리터럴(outerFunc)의 수행 결과(안쪽 함수 리터럴)를 담는다.   
이때 변수 base 에는 "Hiya, Hey " 문자열을 할당한다.   
  
// 새로운 지역 문자열   
var lastString = anotherBase("you");   
document.writeln(lastString);   
안쪽 함수 리터럴(anotherBase)을 수행하고 결과를 변수 lastString에 대입하고 출력한다.   
이때 변수 ext 에 "you" 문자열을 할당하고, 이미 할당된 변수 base 값과 함께 출력한다. 
</script>


5. 클로저의 개념
자바스크립트 프로그램에서는 새로운 영역을 생성할 때마다 이를 둘러싸기 위한 '연관 영역 버블'이 생성된다.
이는 함수에도 적용되며, 해당 함수는 자신의 영역에서 동작하게 된다.

일반적으로 함수가 종료되면, 그 영역도 해제된다. 왜냐하면 더 이상 필요치 않기 때문이다.
하지만 안쪽 함수의 경우엔 이것이 바깥쪽 프로그램에 반환되고 외부 변수에 할당된다.
즉, 안쪽 함수의 영역이 바깥쪽 함수의 영역에 추가되고, 결국 호출 프로그램에 추가되는 것이다.
따라서 함수 리터럴 및 바깥쪽 함수의 인자와 변수를 유지하게 된다.
다른 함수 내에서 내부 객체로 생성된 함수 리터럴을 반환하여 호출 프로그램에서 이를 변수로 배정한 것을 자바스크립트에서는 클로저(closure)라고 한다.
즉, 함수가 동작하는 데 필요한 데이터 영역이 확장되는 것이다.

6. 클로저에 대한 참조 사이트
http://jibbering.com/faq/faq_notes/closures.html

 

번호 제목 글쓴이 날짜 조회 수
30 상속과 Super 로의 접근 황제낙엽 2012.09.18 64
29 inherits() 를 이용한 상속 황제낙엽 2012.07.18 129
28 Defining classes and inheritance (클래스 정의와 상속) 황제낙엽 2011.03.24 392
27 JavaScript Closures for Dummies 황제낙엽 2009.04.08 227
26 체인 생성자(생성자 체인), 프로토타입 체인 그리고 생성자 재지정 황제낙엽 2009.08.12 55
25 [펌] TAEYO.NET - Js OOP - 나만의 프레임워크 만들기 황제낙엽 2009.04.02 18
24 [펌] TAEYO.NET - Js OOP - 사용자 정의 객체. 그리고 상속과 재사용 황제낙엽 2009.04.02 16
23 [펌] TAEYO.NET - JavaScript OOP 코어객체와 prototype를 사용한 객체확장 황제낙엽 2009.04.02 21
22 [펌] 아사페릴의 사생활 - 싱글톤 패턴을 지향한 Javascript Module Pattern 황제낙엽 2009.04.02 90
21 [펌] 아사페릴의 사생활 - Code Conventions for the JavaScript Programming Language 황제낙엽 2009.04.02 194
20 [펌] 아사페릴의 사생활 - __proto__ 와 construct 와 prototype 황제낙엽 2009.04.02 23
19 [펌] 아사페릴의 사생활 - prototype과 __proto__ 와 constructor 황제낙엽 2009.04.02 41
18 [펌] 아사페릴의 사생활 - __proto__ 와 prototype에 대해.. 황제낙엽 2009.04.02 15
17 [펌] 아사페릴의 사생활 - Javascript의 클래스에 관한 이야기 황제낙엽 2009.04.02 17
16 [펌] 아사페릴의 사생활 - Javascript의 constructor 와 prototype 황제낙엽 2009.04.02 156
15 [펌] prototype (2) 황제낙엽 2009.04.02 9
14 [펌] prototype (1) 황제낙엽 2009.04.02 12
13 [key:value] 형태로 object를 저장할 수 있는 Static영역의 해쉬맵 클래스 (Map) 황제낙엽 2008.11.04 46
12 함수와 인자값 (arguments) 황제낙엽 2008.08.12 15
» 중첩 함수, 함수 클로저 황제낙엽 2008.08.12 820