스코프(2)
27 Jan 2021IIFE (Imediately Invoked Function Expressions)
말 그대로 즉시실행 함수이다. 함수의 선언과 실행을 동시에 한다고 보면된다.
Example
(function () {
console.log(1)
})(); // 1
그럼 왜 쓰는 것일까?
전역 스코프를 오염시키지 않기 위해서 사용합니다. 이를 다른말로 표현하면 private 스코프를 사용하기 위함이다.
IIFE의 가장 흔한 예는 counting
함수이다. 우리가 어떤 버튼을 만들고 이 버튼이 몇번 눌렸는지에 대해 기억하고 싶다고 생각을 해보자. 가장 쉬운 방법은 전역 스코프에 count
변수를 선언한 후에 누를때 마다 count+1
하는 방법이 있을 것이다. 하지만 count
라는 변수가 실수에 의해 오염되어 정확하지 않은 수치로 변할 수가 있다. 하지만 IIFE를 이용하면 이를 막을 수 있을 것이다.
var buttonCount = (function(){
let count = 0
return function(){
count += 1
return count
}
})();
console.log(buttonCount()); // 1
console.log(buttonCount()); // 2
console.log(buttonCount()); // 3
이와 같이 buttonCount()
를 실행 할때마다 함수 내부에 있는 count
변수가 1씩 늘어 납니다. 하지만 count
변수를 제어 할 수 있는 것은 buttonCount()
밖에 없기 때문에 아주 private
하다고 할 수 있겠습니다. 그리고 전역 스코프에 선언하 변수도 아니기에 전역 스코프도 오염되지 않았습니다.
IIFE에 대해 간단하게 알아보았다. 나는 아직 JavaScript
에 심도있는 경험이 없어서 그런지 완벽하게 어떤 때에 사용해야 할지에 대해서는 감이 잘 오지는 않지만 혹시 나중에 사용하게 된다면 이 포스팅에 보충 설명을 추가 하도록 하겠습니다.
참조
https://velog.io/@jakeseo_me/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%9D%BC%EB%A9%B4-%EC%95%8C%EC%95%84%EC%95%BC-%ED%95%A0-33%EA%B0%80%EC%A7%80-%EA%B0%9C%EB%85%90-8-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%ED%95%84%EC%88%98%EC%9A%94%EC%86%8C-IIFE-%EB%A7%88%EC%8A%A4%ED%84%B0%ED%95%98%EA%B8%B0
https://starkying.tistory.com/entry/Javascript-Closure-%EA%B7%B8%EB%A6%AC%EA%B3%A0-IIFE%EC%9D%98-%ED%99%9C%EC%9A%A9
러닝 스크립트 : 한빛미디어