웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
(업데이트 중입니다....)
자바스크립트를 배우게되면 클로저(Closure)에 대하여 한 번쯤은 들어보게됩니다. 또한 코딩 과정에서 자신도 모르게 클로저가 나타날 수도 있죠. 이처럼 클로저는 자바스크립트를 사용하다보면은 꼭 알아야하는 중요한 부분 중 하나가 되었습니다. 그렇다면 아래는 클로저에 대하여 자세히 알아보고 클로저가 어떻게 생성되는지 함께 알아보고자합니다.
! 왜 클로저(Closure)를 알아야하는가
자바스크립트는 함수 기반의 언어입니다. 클로저는 함수에 의하여 생겨나고 다양한 상황에서 클로저를 사용하거나 또는 의도하지 않게.. 자신도 모르게 클로저가 사용되어 나타나게됩니다. 이를 모르고 코드를 만들 수 있으나 클로저(Closure)에 대하여 이해가 없으면 수준 높은 자바스크립트 코드를 작성하기 어려우며 비동기식 프로그램 코드 작성에 어려움을 겪을 수 있게됩니다. 그러므로 자바스크립트의 클로저를 이해하고 적용할 수 있어야 할 것입니다.
# 클로저(Closure)란 무엇인가
먼저 클로저가 무엇인지 알아야겠죠? 자바스크립트에서 클로저(Closure)라는 용어를 볼 수 쉽게 만날 수 있으며 그 의미를 보면 다음과 같이 표현됩니다.
'내부함수에서 외부함수의 변수에 접근하는 것이 클로저이다'
말 그래로 내부함수에서 외부함수에 접근할 수 환경에서 클로저가 나타나게됩니다. 여기서 환경이라는 말을 언급했는데 클로저는 이런 환경에서만 생겨납니다. 아래에서 간단한 코드를 사용해보겠습니다.
설명
! 클로저가 발생하는 이유
클로저가 발생하려면 몇 가지 조건이 필요합니다. 먼저 클로저는 익명함수가 사용되어야합니다. 그리고 함수를 리턴 받아야합니다. 이 조건이 있어야 클로저는 나타나게됩니다.
@ 클로저가 생성되려면?
1. 익명함수가 사용될 것
2. 함수내부에서 함수 사용될 것
이처럼 클로저는 함수가 실행되고 그 함수내에 내장함수가 선언될 때... 이때 시점을 기준, 동일영역(Scope)에 해당하는 변수등의 데이터들은 모두 일시적으로 생성된 객체를 통해 저장됩니다. 이를 클로저라 하며 클로저가 생성되었다고 합니다. 결국 클로저를 통해 해당 Scope에 변수를 사용할 수 있습니다. !! 클로저의 가장 큰 특징 및 장점은? 1. 클로저는 함수내의 지역변수를 감추는 은폐의 역할을 가능하게 하며, 이는 곧 다른 언어의 private 키워드와 비슷한 역할을 합니다. 자바스크립트는 private 변수, 즉 외부에서 접근할 수 없는 변수 형태를 선언을 통해 사용할 수는 없습니다. 하지만 동일한 기능을 클로저를 통해 구현할 수 있습니다. 2. 무분별한 전역변수의 사용을 억제하고 발생가능한 변수간의 충돌을 막을 수 있으며 이는 곧 이벤트 및 애니메이션의 효과적인 함수 사용을 가능하게 합니다. 이런 클로저(Closure)를 활용하여 개발한다면 복잡한 코드를 쉽고 간결하고 한단계 더 높은 개발코드를 작성할 수 있습니다. 자바스크립트에서 클로저를 활요할 수 있는 부분은 대부분으로 가장 많이 사용되는 부분은 이벤트 그리고 비동기식 호출의 경우라고 할 수 있습니다. # 클로저의 단점? 클로저도 만능은 아닙니다. 클로저를 어떻게 사용하느냐에 따라 달라지겠지만 기본적으로 메모리와 퍼포먼스 저하라는 문제가 발생할 수도 있습니다. # 참고로 알아두기 i. 클로저는 new 연산자를 사용해 인스턴스를 만들 경우 발생한다 ii. 익명함수를 사용할 경우 역시 클로저는 생성된다 iii. Function 생성자를 사용해 함수를 만들경우 클로저는 생성되지 않는다
자바스크립트를 배우게되면 클로저(Closure)에 대하여 한 번쯤은 들어보게됩니다. 또한 코딩 과정에서 자신도 모르게 클로저가 나타날 수도 있죠. 이처럼 클로저는 자바스크립트를 사용하다보면은 꼭 알아야하는 중요한 부분 중 하나가 되었습니다. 그렇다면 아래는 클로저에 대하여 자세히 알아보고 클로저가 어떻게 생성되는지 함께 알아보고자합니다.
! 왜 클로저(Closure)를 알아야하는가
자바스크립트는 함수 기반의 언어입니다. 클로저는 함수에 의하여 생겨나고 다양한 상황에서 클로저를 사용하거나 또는 의도하지 않게.. 자신도 모르게 클로저가 사용되어 나타나게됩니다. 이를 모르고 코드를 만들 수 있으나 클로저(Closure)에 대하여 이해가 없으면 수준 높은 자바스크립트 코드를 작성하기 어려우며 비동기식 프로그램 코드 작성에 어려움을 겪을 수 있게됩니다. 그러므로 자바스크립트의 클로저를 이해하고 적용할 수 있어야 할 것입니다.# 클로저(Closure)란 무엇인가
먼저 클로저가 무엇인지 알아야겠죠? 자바스크립트에서 클로저(Closure)라는 용어를 볼 수 쉽게 만날 수 있으며 그 의미를 보면 다음과 같이 표현됩니다.'내부함수에서 외부함수의 변수에 접근하는 것이 클로저이다'
말 그래로 내부함수에서 외부함수에 접근할 수 환경에서 클로저가 나타나게됩니다. 여기서 환경이라는 말을 언급했는데 클로저는 이런 환경에서만 생겨납니다. 아래에서 간단한 코드를 사용해보겠습니다.
outerFunc = function(num) {
var a = num;
var innerFunc = function() {
console.log(a);
};
return innerFunc;
}
var a = num;
var innerFunc = function() {
console.log(a);
};
return innerFunc;
}
설명
! 클로저가 발생하는 이유
클로저가 발생하려면 몇 가지 조건이 필요합니다. 먼저 클로저는 익명함수가 사용되어야합니다. 그리고 함수를 리턴 받아야합니다. 이 조건이 있어야 클로저는 나타나게됩니다.@ 클로저가 생성되려면?
1. 익명함수가 사용될 것
2. 함수내부에서 함수 사용될 것
이처럼 클로저는 함수가 실행되고 그 함수내에 내장함수가 선언될 때... 이때 시점을 기준, 동일영역(Scope)에 해당하는 변수등의 데이터들은 모두 일시적으로 생성된 객체를 통해 저장됩니다. 이를 클로저라 하며 클로저가 생성되었다고 합니다. 결국 클로저를 통해 해당 Scope에 변수를 사용할 수 있습니다. !! 클로저의 가장 큰 특징 및 장점은? 1. 클로저는 함수내의 지역변수를 감추는 은폐의 역할을 가능하게 하며, 이는 곧 다른 언어의 private 키워드와 비슷한 역할을 합니다. 자바스크립트는 private 변수, 즉 외부에서 접근할 수 없는 변수 형태를 선언을 통해 사용할 수는 없습니다. 하지만 동일한 기능을 클로저를 통해 구현할 수 있습니다. 2. 무분별한 전역변수의 사용을 억제하고 발생가능한 변수간의 충돌을 막을 수 있으며 이는 곧 이벤트 및 애니메이션의 효과적인 함수 사용을 가능하게 합니다. 이런 클로저(Closure)를 활용하여 개발한다면 복잡한 코드를 쉽고 간결하고 한단계 더 높은 개발코드를 작성할 수 있습니다. 자바스크립트에서 클로저를 활요할 수 있는 부분은 대부분으로 가장 많이 사용되는 부분은 이벤트 그리고 비동기식 호출의 경우라고 할 수 있습니다. # 클로저의 단점? 클로저도 만능은 아닙니다. 클로저를 어떻게 사용하느냐에 따라 달라지겠지만 기본적으로 메모리와 퍼포먼스 저하라는 문제가 발생할 수도 있습니다. # 참고로 알아두기 i. 클로저는 new 연산자를 사용해 인스턴스를 만들 경우 발생한다 ii. 익명함수를 사용할 경우 역시 클로저는 생성된다 iii. Function 생성자를 사용해 함수를 만들경우 클로저는 생성되지 않는다
아래의 글도 찾고 계시지 않나요?
