[typescript] 화살표 함수와 익명 함수의 정의 이해 방식 비교

화살표 함수 (Arrow Function)

TypeScript에서 화살표 함수는 다음과 같이 정의됩니다:

const add = (a: number, b: number): number => {
  return a + b;
};

화살표 함수는 => 기호를 사용하여 함수를 정의하고, 매개변수 목록 뒤에 반환 타입을 지정합니다. 함수 몸체는 중괄호 안에 작성하고, return 키워드를 사용하여 값을 반환합니다.

익명 함수 (Anonymous Function)

TypeScript에서 익명 함수는 다음과 같이 정의됩니다:

const subtract = function(a: number, b: number): number {
  return a - b;
};

익명 함수는 함수 이름을 지정하지 않고 function 키워드를 사용하여 함수를 정의합니다. 매개변수 목록 뒤에 반환 타입을 지정하고, 함수 몸체를 중괄호 안에 작성하여 값을 반환합니다.

비교

화살표 함수와 익명 함수 비교

함수 표현식으로 사용할 때, 화살표 함수와 익명 함수의 주요 차이점은 this의 바인딩 방식입니다. 화살표 함수는 자신의 this 바인딩을 갖지 않고, 상위 스코프의 this를 사용합니다. 반면에 익명 함수는 호출되는 방식에 따라 this가 달라질 수 있습니다.

따라서 화살표 함수는 this가 상위 스코프의 컨텍스트를 유지하는 반면에, 익명 함수는 호출 방식에 따라 this가 동적으로 변할 수 있으므로 주의가 필요합니다.

화살표 함수와 익명 함수는 각각의 장단점을 고려하여 적절한 상황에 사용되어야 합니다.

이상으로 TypeScript에서의 화살표 함수와 익명 함수의 정의와 사용 방식에 대해 비교해 보았습니다.

참고 문헌