화살표 함수는 기존 함수 문법을 완벽하게 대체할 수는 없습니다.
기존 함수로 사용을 해야만 하는 때도 있습니다.
// 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 |