[javascript] 애로우 함수와 일반 함수의 차이점

11 Dec 2023

자바스크립트에서는 애로우 함수(arrow function)와 일반 함수(일반적인 함수 선언)을 사용할 수 있습니다. 이 두 가지 함수의 가장 큰 차이점은 this의 동작 방식입니다.

애로우 함수

애로우 함수는 함수를 정의하는 새로운 방식으로, 함수 내에서 this를 바인딩하지 않습니다. 이는 애로우 함수가 자신의 this 값을 생성될 때의 바깥쪽 범위에서 물려받는다는 것을 의미합니다.

아래는 애로우 함수의 간단한 예제입니다:

const myArrowFunc = () => {
  console.log(this); // 바깥 범위의 `this`를 출력
};

일반 함수는 함수를 정의하는 전통적인 방식으로, 호출될 때마다 자신만의 this 값을 생성합니다.

아래는 일반 함수의 예제입니다:

function myNormalFunc() {
  console.log(this); // 해당 함수가 호출될 때의 `this`를 출력
}

애로우 함수와 일반 함수의 주요 차이점은 this의 동작 방식입니다. 애로우 함수는 this를 생성될 때의 외부 범위에서 물려받지만, 일반 함수는 각각의 호출마다 새로운 this를 생성합니다.

따라서, this의 동작 방식을 이해하는 데 있어서 두 함수의 차이를 이해하는 것이 중요합니다.

참고문헌: