[JavaScript] ArrowFunction

ArrowFunction

❗️특징

• this 키워드: Arrow function은 자신만의 this를 생성하지 않습니다. 대신, 선언된 곳의 스코프에서 this를 가져온다.

• Arrow function을 클래스 메서드로 사용할 때, 해당 클래스의 인스턴스를 가리키는 this를 얻을 수 있다.

• arguments 객체:Arrow function은 arguments 객체를 가지지 않는다.

• 호이스팅:Arrow function은 호이스팅(hoisting)되지 않습니다. 즉, 선언 전에 호출할 수 없다.

• 생략 가능한 괄호 : 인자가 하나뿐이라면 괄호를 생략할 수 있다.

✍ 예시 코드

문법

const singleArg = arg => {
  // 함수 내용
};

ArrowFunction, Function 차이점

class Example {
  constructor() {
    this.value = 1;
  }

  arrowFunction() {
    setTimeout(() => {
      console.log(`Arrow Function: ${this.value}`);
    }, 1000);
  }
  
  regularFunction() {
    setTimeout(function() {
      console.log(`Regular Function: ${this.value}`);
    }, 1000);
  }
	
  const exampleObj = new Example();
  exampleObj.arrowFunction(); // 출력: Arrow Function: 1
  exampleObj.regularFunction(); // 출력: Regular Function: undefined

}

ArrowFunction과 Function의 차이점 중 큰 중요도는 this인거 같다.
상황에 따라서 ArrowFunction과 Function을 사용하면 좋을거같다.