익명의 개발노트

Closure 본문

프로그래밍/javascript

Closure

캡틴.JS 2019. 2. 26. 13:23
반응형

클로져란? 


1) 외부함수의 변수에 접근할 수 있는 내부 함수( 외부함수가 실행 종료되어 소멸했음에도 불구하고 내부함수는 외부함수의 변수에 접근가능)


2) scope chain으로 표현되기도 함


3) 보통함수를 return 하여 사용


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


<한번 생각해 보기>


function outer() {

  console.log('outer fn invoked');

  function inner() {

    console.log('inner fn invoked');

  }

  return inner;

}


outer(); // →   outer fn invoked, 

                 ƒ inner() {

                            console.log('inner fn invoked');

                  }

outer()();  // →   outer fn invoked, inner fn invoked

var innerFn = outer(); // →   outer fn invoked

innerFn(); // →   inner fn invoked


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


1) 클로져 자신에 대한 접근(closure function 내에 정의된 변수)


2) 외부 함수의 변수에 대한 접근


3) 전역 변수에 대한 접근

ㅇㅇㅇ

var greeting = 'Hello'; // 전역 변수에 대한 접근 가능


function showName(firstName, lastName) {
var nameIntro = 'My name is ';
function makeFullName() {
// 이 내부 함수(makeFullName)는 외부 함수(showName)의 변수뿐만 아니라 파라미터 까지 사용할 수 있다. return greeting + ', ' + nameIntro + firstName + ' ' + lastName; }
return makeFullName();
} showName('Michael', 'Jackson'); // Hello, My name is Michael Jackson




반응형

'프로그래밍 > javascript' 카테고리의 다른 글

IIFE( Immediately Invoked Function Expression)  (0) 2019.02.27
this  (0) 2019.02.26
Scope  (0) 2019.02.26
[디버깅] 크롬을 활용한 디버깅하는 법  (0) 2019.02.22
[배열] 내장 메서드  (0) 2019.02.19
Comments