[JS] Arrow function 과 function의 차이

1. this

• 자바스크립트는 인터프리터에 의해 한 줄 씩 읽히면서 해석되어 실행 된다.
• 인터프리터에 의해 현재 실행되는 JS의 환경을 실행 컨텍스트라고 한다.
• this는 실행되는 코드의 실행 컨텍스트를 가리킨다.

 

Arrow function

화살표 함수의 this는 언제나 상위 스코프의 this를 가리킨다.

자신이 종속된 인스턴스를 가리킴.

 

function

함수가 어떻게 호출되는지에 따라 this에 바인딩할 객체가 달라진다.

자신이 종속된 객체를 this로 가리킴.

 

=> 중첩함수 안에서 this불일치로 발생하는 문제들을 화살표 함수가 해결.

 

2. 인스턴스 생성 불가

Arrow function

생성자 함수로 사용할 수 없다.(프로토타입 프로퍼티를 가지고 있지 않기 때문.)

 

function

생성자 함수로 사용할 수 있다.

 

3. arguments 차이

*arguments는 함수 호출 시 전달된 인수들의 정보를 담고 있는 유사배열객체.

Arrow function

화살표 함수는  arguments객체를 가지지 않음.

 

function

일반 함수는 arguments객체를 가져 사용할 수 있음.

 

 

참고 https://poiemaweb.com/es6-arrow-function

참고 https://hhyemi.github.io/2021/06/09/arrow.html