Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- aws lightsail
- nextjs
- tailwindcss
- 슬라이딩윈도우
- JavaScript
- 블로그만들기
- TypeScript
- cookie
- js알고리즘
- NextAuth
- 해쉬
- typscript
- 투포인터
- next.js
- styled-components
- 빅오
- 정렬
- Algorithm
- react
- react-query
- 그리디
- 버블정렬
- nestjs
- 스택
- isNaN
- 라이프사이클
- never타입
- 알고리즘
- textarea autosize
- 큐
Archives
- Today
- Total
far
[Javascript] 즉시 실행 함수(IIFE, Immediately Invoked Function Expression) 본문
Javascript
[Javascript] 즉시 실행 함수(IIFE, Immediately Invoked Function Expression)
Eater 2023. 3. 20. 12:42즉시 실행 함수
즉시 실행 함수란 함수 정의와 동시에 즉시 호출되는 함수를 말하며, 단 한 번만 호출되고 다시 호출 할 수 없다. 즉시 실행 함수는 지금은 잘 사용하지 않지만 ES6이전 var를 블록 레벨 스코프로 사용하기 위해 고안되었으며, 주로 변수를 전역 스코프에 선언하는 것을 피하기 위해 사용한다.
(function () {
let a = 3;
let b = 5;
return a * b;
}());
// 화살표 함수로도 사용 가능
(() => {
let a = 3;
let b = 5;
return a * b;
}());
즉시 실행 함수는 위와 같이 익명 함수를 사용하는 것이 일반적이지만 기명 함수로도 사용이 가능하다.
(function foo() {
let a = 3;
let b = 5;
return a * b;
}());
foo(); // ReferenceError: foo is not defined
즉시 실행 함수는 반드시 그룹 연산자 ( ... )로 감싸야 한다. 그렇지 않으면 에러가 발생한다.
function () { // SyntaxError: Function statements require a function name
// ...
}();
자바스크립트 엔진이 수행하는 세미콜론 자동 삽입 기능에 의해 함수 코드 블록의 닫는 중괄호 뒤에 세미콜론( ; )이 암묵적으로 추가된다.
function foo() {
// ...
}(); // SyntaxError: Unexpected token ')'
// => function () {};();
즉시 실행 함수도 일반 함수처럼 값을 반환할 수 있고 인수를 전달할 수도 있다.
// 즉시 실행 함수도 일반 함수처럼 값을 반환할 수 있다.
const res = (function () {
let a = 3;
let b = 5;
return a * b;
}());
console.los(res); // 15
// 즉시 실행 함수에도 일반 함수처럼 인수를 전달할 수 있다.
res = (function (a, b) {
return a * b;
}(3, 5));
console.log(res); // 15
참고: 모던 자바스크립트 Deep Dive
'Javascript' 카테고리의 다른 글
[Javascript] 프로퍼티 어트리뷰트 (0) | 2023.03.22 |
---|---|
[Javascript] var와 let, const의 차이 (0) | 2023.03.21 |
[Javascript] 자바스크립트의 단축 평가 (0) | 2023.03.19 |
[Javascript] 자바스크립트의 형 변환(타입 변환) (0) | 2023.03.19 |
[Javascript] 자바스크립트의 데이터 타입 (0) | 2023.03.18 |
Comments