자바스크립트 일반 함수, 익명 함수, 화살표 함수의 차이점

 

 

 

 

자바스크립트에서 함수를 선언하는 방법에는 여러 가지가 있으며, 그중에서도 일반 함수(Named Function), 익명 함수(Anonymous Function), 그리고 화살표 함수(Arrow Function)는 가장 기본적인 개념입니다. 이번 글에서는 각각의 특징과 차이점에 대해 자세히 살펴보겠습니다.

1. 일반 함수 (Named Function)

일반 함수는 이름이 있는 함수로, function 키워드를 사용하여 선언됩니다. 이러한 함수는 재사용이 가능하고, 코드의 가독성을 높이는 데 도움이 됩니다.

특징

1. 이름을 가진다 - 함수 선언 시 함수 이름을 지정할 수 있습니다.
2. 호이스팅(Hoisting)이 적용된다 - 함수 선언문은 코드 실행 전에 메모리에 등록되므로, 선언하기 전에 호출할 수 있습니다.
3. 재사용이 용이하다 - 동일한 함수 이름을 사용하여 여러 곳에서 호출할 수 있습니다.
4. 디버깅이 용이하다 - 함수 이름이 있기 때문에 오류 발생 시 스택 트레이스에서 함수명을 확인할 수 있습니다.

function add(a, b) {
    return a + b;
}

console.log(add(2, 3)); // 5

위의 add 함수는 function 키워드를 이용해 선언되었으며, 함수 이름을 통해 호출할 수 있습니다.

2. 익명 함수 (Anonymous Function)

익명 함수는 이름이 없는 함수로, 주로 변수에 할당하거나 콜백 함수로 사용됩니다.

특징

1. 이름이 없다 - 함수 선언 시 함수 이름을 지정하지 않습니다.
2. 호이스팅이 제한적이다 - 함수 표현식으로 선언하면, 해당 변수에 할당되기 전에 호출할 수 없습니다.
3. 일회성 사용에 적합하다 - 콜백 함수나 즉시 실행 함수(IIFE)에서 자주 사용됩니다.
4. 디버깅이 어려울 수 있다 - 스택 트레이스에서 함수명이 없기 때문에 분석이 어려울 수 있습니다.

const multiply = function (a, b) {
    return a * b;
};

console.log(multiply(2, 3)); // 6

위의 multiply 함수는 이름 없이 변수 multiply에 할당되었습니다. 이 경우, multiply를 통해 함수를 호출할 수 있지만, 함수 자체에는 이름이 없습니다.

3. 화살표 함수 (Arrow Function)

화살표 함수는 ES6에서 도입된 함수 표현식의 한 형태로, 간결한 문법과 this 바인딩이 특징입니다.

특징

1. 간결한 문법 - function 키워드 없이 =>를 사용하여 함수를 정의할 수 있습니다.
2. this 바인딩이 다르다 - 일반 함수와 달리 화살표 함수는 자신만의 this를 가지지 않고, 상위 스코프의 this를 유지합니다.
3. 생성자 함수로 사용할 수 없다 - new 키워드를 사용하여 인스턴스를 생성할 수 없습니다.
4. arguments 객체가 없다 - arguments 객체를 지원하지 않으며, 대신 전개 연산자(...args)를 사용해야 합니다.

const subtract = (a, b) => a - b;
console.log(subtract(5, 2)); // 3

const greet = name => `Hello, ${name}!`;
console.log(greet("Alice")); // Hello, Alice!

화살표 함수는 간결한 문법 덕분에 콜백 함수나 짧은 로직을 처리할 때 유용합니다.

4. 일반 함수, 익명 함수, 화살표 함수의 차이점

 

구분	일반 함수 (Named Function)	익명 함수 (Anonymous Function)	화살표 함수 (Arrow Function)
함수명	있음	없음	없음
호이스팅	가능	변수 선언 이후에만 호출 가능	변수 선언 이후에만 호출 가능
this 바인딩	호출 방식에 따라 결정	호출 방식에 따라 결정	상위 스코프 this 유지
arguments 객체	지원됨	지원됨	지원되지 않음
생성자 사용	가능	가능	불가능
사용 사례	재사용 가능한 함수, 모듈	콜백 함수, 즉시 실행 함수 (IIFE)	짧은 함수, 콜백 함수

 

 

 

• 일반 함수는 이름이 있으며, 재사용과 디버깅이 용이하고, 호이스팅이 적용됩니다.
• 익명 함수는 이름 없이 주로 변수에 할당되거나 콜백 함수로 사용되며, 호이스팅이 제한됩니다.
• 화살표 함수는 간결한 문법을 제공하며, this 바인딩이 다르게 동작합니다.