화살표 함수는 기존 함수 문법을 완벽하게 대체할 수는 없습니다.

기존 함수로 사용을 해야만 하는 때도 있습니다.

// add1, add2, add3, add4 모두 동일한 함수
function add1(x, y) {
  return x + y;
}

const add2 = (x, y) => {
  return x + y;
};

// add3과 같이 간결하게 변경이 가능하지만 헷갈릴 수 있어서 add4로 주로 씁니다.
const add3 = (x, y) => x + y;
const add4 = (x, y) => (x + y);

 

// not1을 not2로 변경 가능, 매개변수가 1개일 때는 괄호도 생략 가능
function not1(x){
  return !x;
}

const not2 = x => !x;

 

// 객체를 바로 return 할 때는 (괄호)를 꼭 작성해야 합니다.
const obj = (x,y) =>({x,y});

 

기존 function 문법이 안 사라진 이유는 기존 this 때문입니다.

function 에서는 this를 따로 갖는데 화살표 함수는 부모의 this를 물러 받습니다.

 

var relationship1 = {
  name: "gildong",
  friends: ["a", "b", "c"],
  logFriends: function () {
    var that = this; // relationship1을 가리키는 this를 that에 저장
    this.friends.forEach(function (friend) {
      console.log(that.name, friend);
    });
  },
};
relationship1.logFriends();

 

결과화면 

D:\code\node\lecture2>node test1.js
gildong a
gildong b
gildong c

 

화살표 함수가 기존 function(){}을 대체하는 것은 아닙니다.(this가 달라짐)

- logFriedns 메서드의 this 값에 주목

-  forEach의 function의 this와 logFriends의 this는 다름

- that 이라는 중간 변수를 이용해서 logFriends의 this를 전달

 

this를 사용해야 할 때는 function 을 사용하고

this를 사용하지 않을 때는 화살표 함수를 사용하는 것을 추천합니다.

 

'Javascript > Node' 카테고리의 다른 글

프로미스 promise async await  (0) 2024.11.02
템플릿 문자열 객체 리터럴  (0) 2024.10.31
var const let 자바스크립트 변수 상수  (0) 2024.10.30
Node.js 다운로드 설치 최신버전 22버전  (0) 2024.10.29
서버 노드  (0) 2024.10.28

+ Recent posts