JavaScript 화살표 함수(Arrow Function)

JavaScript의 화살표 함수(Arrow Function)는 함수 표현을 간결하게 만들어주는 문법입니다. 화살표 함수는 function 키워드 없이 함수를 정의할 수 있으며, this 키워드의 바인딩 방식이 다르게 작동합니다.

기본 문법

화살표 함수의 기본 문법은 다음과 같습니다:

const myFunction = (parameter1, parameter2) => {
// 함수 본문
return something;
}
만약 함수가 한 줄이고 결과를 바로 반환한다면, 중괄호와 return 키워드를 생략할 수 있습니다:

const add = (a, b) => a + b;
하나의 매개변수만 받는 경우, 괄호를 생략할 수 있습니다:

const square = x => x * x;

this의 특성

화살표 함수는 자신만의 this 바인딩을 생성하지 않습니다. 따라서 화살표 함수 내부에서 this를 사용하면, 화살표 함수를 둘러싼 코드의 this 값이 사용됩니다. 이는 특히 객체의 메서드나 이벤트 리스너에서 유용합니다:

const myObject = {
value: 42,
getValue: function() {
setTimeout(() => {
console.log(this.value); // 42
}, 1000);
}
};

myObject.getValue();

화살표 함수의 제한

화살표 함수는 생성자로 사용할 수 없으며, new 키워드로 호출하려고 하면 오류가 발생합니다.
arguments 객체를 사용할 수 없습니다.
화살표 함수는 yield 키워드를 포함할 수 없으므로 제너레이터로 사용할 수 없습니다.

요약

화살표 함수는 간결한 문법과 this 키워드의 특별한 처리 방식을 제공합니다. 한 줄짜리 함수나 특정 문맥의 this를 유지해야 할 때 유용합니다. 그러나 일부 제한 사항이 있으므로, 전통적인 함수 표현이 더 적합한 경우도 있습니다.