TIL_20210325

화살표 함수

• 화살표 함수에는 this가 없다. 화살표 함수 본문에서 this에 접근하면, 외부에서 값을 가져옴
• this가 없기 때문에 화살표 함수는 생성자 함수로 사용 불가능. new와 함께 호출 불가능

let drink = {
  title: "wine",
  kinds: ["red", "white", "rose"],

  showList() {
    this.kinds.forEach(
      kind => alert(this.title + ': ' + kind)
    );
  }
};

drink.showList();

• 화살표 함수 본문에 있는 this.title은 화살표 함수 바깥에 있는 메서드인 showList가 가리키는 대상과 동일. 즉, this.title은 drink.title과 동일
• 화살표 함수에서는 모든 인수에 접근할 수 있게 해주는 유사 배열 객체 arguments 미지원

// 화살표 함수를 이용하여 구현한 데코레이터 함수
function defer(f, ms) {
  return function() {
    setTimeout(() => f.apply(this, arguments), ms)
  };
}
function sayHi(who) {
  alert('Hi, ' + who);
}
let sayHiDeferred = defer(sayHi, 3000);
sayHiDeferred("Chungsik"); // 3초 후 "Hi, Chungsik" 출력

// 일반 함수를 이용하여 구현한 데코레이터 함수
function defer(f, ms) {
  return function(...args) {
    let ctx = this;
    setTimeout(function() {
      return f.apply(ctx, args);
    }, ms);
  };
}
// setTimeout에 넘겨주는 콜백 함수에서 사용할 변수 ctx와 args를 반드시 생성