자바스크립트 익명 함수 (Anonymous Functions)

09 Sep 2023

javascript

자바스크립트에서 함수는 일급 객체로 취급되기 때문에 변수에 할당하고, 다른 함수에 매개변수로 전달하고, 함수 내부에서 정의할 수 있습니다. 익명 함수는 이름 없이 정의되는 함수로, 주로 콜백 함수나 즉시 실행 함수 등에서 사용됩니다.

익명 함수의 정의와 사용

익명 함수는 function 키워드를 사용하여 정의되며, 변수에 할당되거나 다른 함수의 매개변수로 전달될 수 있습니다. 함수의 이름이 없기 때문에 변수 이름을 통해 함수를 참조할 수 있습니다.

var myFunc = function() {
  console.log("This is an anonymous function");
};

myFunc(); // "This is an anonymous function"

위의 예제에서 myFunc 변수에 익명 함수를 할당하고, 호출할 때 변수를 통해 함수를 실행합니다.

즉시 실행 함수 (Immediately Invoked Function Expression, IIFE)

즉시 실행 함수는 정의된 즉시 실행되는 익명 함수입니다. 이 함수는 한 번만 실행되며, 주로 전역 스코프의 변수를 오염시키지 않고 작업을 수행하기 위해 사용됩니다.

IIFE는 함수를 익명 함수로 정의하고, 함수 정의 뒤에 소괄호 ()를 붙여 함수를 즉시 실행합니다.

(function() {
  console.log("This is an immediately invoked function expression");
})();

// "This is an immediately invoked function expression"

IIFE는 함수 정의와 동시에 실행되기 때문에 괄호로 함수를 둘러싸줘야 합니다. 이를 통해 함수 인스턴스가 반환되지 않고 즉시 실행된다는 것을 나타냅니다.

콜백 함수 (Callback Functions)

콜백 함수는 다른 함수의 매개변수로 전달되는 익명 함수입니다. 콜백 함수는 이벤트 핸들러나 비동기 작업 완료 등의 상황에서 사용됩니다.

function clickHandler(callback) {
  console.log("Click event occurred!");
  callback();
}

clickHandler(function() {
  console.log("This is a callback function");
});

// "Click event occurred!"
// "This is a callback function"

위의 예제에서 clickHandler 함수는 click 이벤트가 발생하면 실행되는 함수입니다. 이벤트가 발생한 후, 전달된 콜백 함수가 실행되며, 해당 함수는 이벤트 처리 후 실행될 로직을 정의합니다.

결론

자바스크립트에서 익명 함수는 함수를 일급 객체로 취급하는 특징을 활용할 수 있게 해줍니다. 익명 함수는 변수에 할당되거나 다른 함수 내부에서 정의되어 유연한 코드 작성을 가능하게 합니다. 또한, 즉시 실행 함수와 콜백 함수를 통해 전역 스코프 오염과 비동기 작업 처리 등의 문제를 해결할 수 있습니다.

익명 함수의 사용은 코드의 가독성과 유지보수성을 높이는 데 도움을 주며, 자바스크립트 프로그래밍에서 필수적인 개념입니다.

참고 자료: