언어 및 도구들 공부/Javascript

즉시실행함수, 익명함수

Dr.Mlem 2024. 9. 5. 13:22

즉시실행 함수 하나 형태를 보여줘

Show drafts
 
 

즉시 실행 함수 (IIFE) 예시

가장 기본적인 형태의 즉시 실행 함수는 다음과 같습니다:

JavaScript
(function() {
  console.log("즉시 실행 함수가 실행되었습니다!");
})();
Use code with caution.
 

설명:

  • function() { ... } 부분은 익명 함수를 정의합니다.
  • 이 함수를 괄호 () 로 감싸서 함수 표현식으로 만듭니다.
  • 그 뒤에 () 를 붙여 함수를 즉시 호출합니다.

다른 형태의 IIFE 예시:

  • 인자 전달:
JavaScript
(function(name) {
  console.log("Hello, " + name + "!");
})("Alice"); // 출력: Hello, Alice!
Use code with caution.
 
  • 반환 값 활용:
JavaScript
const result = (function() {
  const num1 = 10;
  const num2 = 20;
  return num1 + num2;
})();

console.log(result); // 출력: 30
Use code with caution.
 
  • ES6 arrow function 활용:
JavaScript
(() => {
  console.log("ES6 arrow function을 사용한 IIFE입니다.");
})();
Use code with caution.
 
  • async/await 활용:
JavaScript
(async () => {
  const response = await fetch('https://api.example.com/data');
  const data = await response.json();
  console.log(data);
})();
Use code with caution.
 

IIFE 활용 시나리오:

  • 전역 변수 오염 방지: IIFE 내부에서 선언된 변수는 외부에서 접근할 수 없으므로, 전역 변수 이름 충돌을 방지할 수 있습니다.
  • 모듈 패턴 구현: IIFE를 사용하여 private 변수와 public 함수를 갖는 모듈을 만들 수 있습니다.
  • 라이브러리 초기화: 라이브러리를 초기화하거나 설정하는 코드를 IIFE로 감싸서 실행할 수 있습니다.
  • 페이지 로드 시 특정 작업 수행: 페이지 로드 시 즉시 실행해야 하는 코드를 IIFE로 감싸서 실행할 수 있습니다.

주의 사항:

  • IIFE는 한 번만 실행됩니다.
  • IIFE 내부에서 선언된 변수는 IIFE 외부에서 접근할 수 없습니다.
  • ES6의 let, const 키워드를 사용하면 블록 스코프를 이용하여 변수 범위를 제한할 수 있으므로, IIFE 사용 필요성이 줄어들 수 있습니다.

결론:

IIFE는 JavaScript에서 유용한 기법 중 하나입니다. 변수 범위를 제한하고, 코드를 즉시 실행하며, 모듈 패턴을 구현하는 등 다양한 용도로 활용할 수 있습니다.

 
 
 
 
 
 

익명함수는 따로 함수 이름 정의 안하고 기능 그 자체를 가져와서 사용하는거지?

 
Show drafts
 

네, 정확하게 이해하셨습니다. 익명 함수는 이름 없이 함수의 기능 그 자체를 정의하고 사용하는 방식입니다.

일반적으로 함수는 function 함수이름() { ... } 형태로 이름을 붙여 정의하지만, 익명 함수는 이름 부분을 생략하고 함수 표현식으로 정의합니다.

익명 함수 예시:

JavaScript
const myFunction = function() {
  console.log("익명 함수 실행");
};

myFunction(); // 익명 함수 실행
Use code with caution.
 

위 예시에서 function() { ... } 부분이 익명 함수입니다. 이 익명 함수는 myFunction 변수에 할당되어 호출될 수 있습니다.

익명 함수의 활용:

  • 콜백 함수: 다른 함수의 인자로 전달되어 특정 시점에 실행되는 함수
  • 이벤트 핸들러: 특정 이벤트 발생 시 실행되는 함수
  • 즉시 실행 함수 (IIFE): 정의와 동시에 실행되는 함수

익명 함수의 장점:

  • 간결한 코드 작성: 함수 이름을 정의할 필요가 없어 코드가 간결해집니다.
  • 변수 범위 제한: 익명 함수 내부에서 선언된 변수는 외부에서 접근할 수 없어 변수 이름 충돌을 방지할 수 있습니다.
  • 유연한 활용: 콜백 함수, 이벤트 핸들러 등 다양한 용도로 활용할 수 있습니다.

익명 함수의 단점:

  • 디버깅 어려움: 함수 이름이 없어 디버깅 시 함수를 식별하기 어려울 수 있습니다.
  • 재사용성 제한: 함수 이름이 없어 다른 곳에서 재사용하기 어렵습니다.

결론:

익명 함수는 이름 없이 함수의 기능 그 자체를 정의하고 사용하는 방식으로, 간결한 코드 작성과 변수 범위 제한 등의 장점을 갖습니다. 하지만 디버깅 어려움과 재사용성 제한 등의 단점도 있으므로, 상황에 따라 적절하게 사용해야 합니다.

'언어 및 도구들 공부 > Javascript' 카테고리의 다른 글

RESTful 라우팅  (0) 2024.09.05
appendChild vs insertAdjacentHTML  (1) 2024.09.05
즉시실행 함수  (0) 2024.09.05
Promise와 async-await 2(23-01 실습문제)  (0) 2024.09.05
RegexHelper 3  (0) 2024.09.04