Jveloper

Closure 본문

JavaScript

Closure

Jveloper 2019. 4. 25. 20:16

클로져란? 외부함수의 변수에 접근할 수 있는 내부함수

- scope chain으로 표현되기도 함

- return 하는 내부함수를 클로져 함수라고 지칭

 

function 외부함수() {
  let 외부함수의 변수 = 'outer fn variable ';
  function 내부함수() {
    let 내부함수의 변수 = 'inner fn variable ';
      console.log(외부함수의 변수 + 내부함수의 변수);
  }
}
    // 외부함수의 변수를 내부 함수, 즉 closure가 사용할 수 있음

 

내부함수의 접근하는 두가지 방법.

1. 외부함수()()

2. var innerFn = 외부함수()

    innerFn()


클로져가 가지는 세가지 scope chain

1. 클로져 자신에 대한 접근(위 예제의 내부함수안의 변수)

2. 외부함수의 변수에 대한 접근(위 예제의 외부함수안의 변수)

3. 전역변수에 대한 접근

 

내부함수는 외부함수의 변수뿐만 아니라 파라미터까지 사용할 수 있다 예제를 보자

let 인사 = '안녕하세요';
function 외부함수(성, 이름){
  let 설명 = '저의 이름은';
  function 내부함수(){
    return 인사 + ', ' + 설명 + ' ' + 성 + ' ' + 이름 + '입니다.'
  }
  return 내부함수();
}

외부함수('J', 'veloper');
// 안녕하세요, 저의 이름은 J veloper입니다.

클로저 활용예제 두가지

 

클로저 예제 1.
클로저 예제 2.

 

'JavaScript' 카테고리의 다른 글

__proto__, constructor, prototype  (0) 2019.06.03
Recursion(재귀 함수)  (0) 2019.05.07
Prototype  (0) 2019.05.07
Scope  (0) 2019.04.23
Node.appendChild 와 Node.prepend  (0) 2019.04.15
Comments