너의 Arrow Function 조심해.

x => x * x
... 에 상당하다

function(x) {
  return x * x
}

매우 편리하고 익명 함수에 해당한다.
만약 파라미터가 많고 줄이 많으면 이렇게 쓰세요.

(x, y) => {
    ...
    return ...
}

그리고 화살표 함수의this 작용역이 복구되었습니다.

몇 가지 예

var obj = {
    birth: 1990,
    getAge: function () {
        var that = this;
        var fn = function () {
            return new Date().getFullYear() - that.birth; // this window undefined
        };
        return fn();
    }
};

화살표 함수를 사용하면 작용역을 귀속할 필요가 없습니다.

var obj = {
    birth: 1990,
    getAge: function () {
        var b = this.birth; // 1990
        var fn = () => new Date().getFullYear() - this.birth; // this obj 
        return fn();
    }
};
obj.getAge(); // 25

절대 화살표 함수 Arrow Function을 남용해서는 안 됩니다!
바로this의 지향이 이미 다르기 때문에 우리는 문제에 부딪힐 수 있다.

var xiaoming = {
    name: ' ',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
    toJSON: function () {
        return { //  name age， key：
            'Name': this.name,
            'Age': this.age
        };
    }
};

JSON.stringify(xiaoming); // '{"Name":" ","Age":14}'

우리는 대상에서 정상적인 함수를 사용하여 JSON을 변환하는 방법을 정의했는데 이것은 문제없다.
화살표 함수로 바꾸면?

var xiaoming = {
    name: ' ',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
    toJSON: () => ({'Name': this.name, 'Age': this.age})
};

JSON.stringify(xiaoming); // "{"Name":""}"

왜 이러지?이때this는 윈도우를 가리키기 때문에 역할 영역은 전역입니다. (이때xiaoming은 전역 변수이기 때문입니다.)
계속 비교하다.

function foo() {
  let a = 1
  let b = () => console.log(this.a)

  b()
}

foo()  // 1

let a = {
  foo: 1,
  bar: () => console.log(this.foo)
}

a.bar()  //undefined

화살표 함수 자체는this가 없습니다. 부모 역할역에만 요청합니다.function은 블록급 작용역을 지정했기 때문에 function에서arrow를 활용하면 전체 국면에 요청을 피할 수 있습니다.var로 정의하면arrow를 조심하세요!

참고 자료

http://www.open-open.com/lib/view/open1482063707519.html
https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/001434499490767fe5a0e31e17e44b69dcd1196f7ec6fc6000
https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/001438565969057627e5435793645b7acaee3b6869d1374000