1. 화살표 함수에는 'this'가 없다.
--> 그래서 화살표 함수 본문에서 this에 접근하면, 외부에서 값을 가져온다. 이 특징은 객체의 메서드 안에서 동일 객체의 프로퍼티를 대상으로 순회를 하는 데 사용할 수 있다.
let group = {
title: "작두팔들",
students: ["졍", "썬", "셩"],
showList() {
this.students.forEach(
student => alert(this.title + ': ' + student)
);
}
};
group.showList();
--> forEach에서 화살표 함수를 사용했기 때문에 화살표 함수 본문에 있는 this.title은 화살표 함수 바깥에 있는 메서드인 showList가 가리키는 대상과 동일해짐. (group) 즉, this.title은 group.title과 같다.
**화살표 함수가 아니라 일반함수를 사용했다면 에러가 발생함
let group = {
title: "작두팔들",
students: ["졍", "썬", "셩"],
showList() {
this.students.forEach(function(student) {
alert(this.title + ': ' + student)
});
}
};
group.showList();
// this.title이 undefined이기 때문에 에러가 발생함
2. 화살표 함수엔 'arguments'가 없다.
--> 화살표 함수는 일반 함수와는 다르게 모든 인수에 접근할 수 있게 해주는 유사 배열 객체 arguments를 지원하지 않는다. 이 특징은 현재 this 값과 arguments 정보를 함께 실어 호출을 포워딩해주는 데코레이터를 만들 때 유용하게 사용됨.
function defer(f, ms) {
return function() {
setTimeout(() => f.apply(this, arguments), ms)
};
}
function sayHi(who) {
alert('안녕, ' + who);
}
let sayHiDeferred = defer(sayHi, 2000);
sayHiDeferred("철수");
((이부분도 데코레이터 나와서 이해 잘 못함;;))
--> 데코레이터 defer(f,ms)는 함수를 인자로 받고 이 함수를 래버로 감싸서 반환하는데, 아마 this가 sayHi를 가리켜서
sayHiDefeered("철수")를 넣으면 '안녕' + '철수' 가 2초 뒤에 출력되는 방식인듯....
'Front-end > JavaScript' 카테고리의 다른 글
[JavaScript] 마이크로태스크 (0) | 2022.05.29 |
---|---|
[JavaScript] 프라미스화 Promisfication (0) | 2022.05.29 |
[JavaScript] 함수 바인딩 (bind) (0) | 2022.05.09 |
[JavaScript] 데코레이터 ((미완)) (0) | 2022.05.09 |
[JavaScript] setTimeout과 setInterval을 이용한 호출 스케줄링 (0) | 2022.05.09 |