본문 바로가기

Dev. Front-End/JavaScirpt

[Javascript] 클로저 (Closure)

 

 

 

클로저란?

: 지역변수를 남겨두는 현상이라고 부르기도하고, 리턴된 함수 자체를 클로저라고도하며, 정의가 워낙 다양하기에

아래 예제를 통해 설명드리겠습니다.

클로저 조건

 

- 반환되는 내부 함수는 외

부 함수의 실행환경에서 실행됩니다.

- 내부 함수가 익명 함수로 되어 외부 함수의 return값으로 사용되어야 합니다.

- 내부 함수에서 사용되는 변수는 외부 함수의 변수 스코프에 있어야 합니다.

 

 

 

function test(name){
	var output = 'Hello ' + name +'!';
}
console.log(output);

<클로저 사용전>

아마 출력에서 오류가 발생하게 됩니다.

함수안에 있는 output변수는 지역변수이므로 함수 외부에서 사용할수없기에 오류가 발생합니다.

지역변수는 함수가 실행 될때 생성되고 함수가 종료될때 사라집니다.

그래서 함수안에 output변수는 함수안에서 생성되고 사라집니다.

아래 예제를 통해 클로저를 사용해서 이 오류를 해결해보겠습니다.

 

 

 

function test(name){
	var output = 'Hello ' + name +'!';
	return function(){
		console.log(output);
	}
}
test('종알이')();

<클로저 사용후>

위에 예제를 보면 함수안에 output변수는 지역변수이기에 함수가 종료될때 사라져야 정상입니다.

하지만, 해당 변수가 이후에도 활용될 가능성이 있기에 자바스크립트는 변수를 제거하지 않고 남겨두게되죠.

그래서 코드실행하면 "Hello 종알이!"라고 정상 출력이 됩니다.

이런 방식을 '클로저'라고합니다. 클로저 함수로 인해 남은 지역변수는 클로저 함수 각각의 고유한 변수입니다.

( + 추가로 지역변수 output을 남겨둔다고 외부에서 마음대로 사용할수는 없습니다. )