es6 화살표 함수 및this의 지향 문제

es3, es5의 구조 함수와 es6의 화살표 함수의 차이:

es3 es5의 함수 쓰기:
function (){
}
es6의 화살표 함수 쓰기:
()=>{
}
참고: 매개 변수가 하나이고 함수 내에서 매개 변수를 반환값으로 직접 사용하면 ()와 {}를 생략할 수 있습니다.

 {
    var array = [1,2,3,4,5];
    var adds = array.map(function (v) {
      return v+1;
    });
    console.log(array,adds);
}
{
    let arr = [1, 2, 3, 4, 5];
    let odd = arr.map((v) => {
        return v + 1;
    });
    console.log(arr, odd);
}

es3 es5 및 es6에서this의 지향 문제:

es3과es5에서의this의 지향 문제,this는 이 함수가 호출되었을 때의 대상을 가리키고, 아래 코드에서 c대상은 b()를 호출했기 때문에this가 가리키는 것은 c대상이기 때문에 마지막으로 출력한 것은'a+'입니다.

{
    var factory = function () {
        this.a = 'a';
        this.b = 'b';
        this.c =  {
            a: "a+",
            b: function f() {
              return this.a;
            }
        }
    };
    console.log(new factory().c.b());
}

es6의this의 지향 문제,this의 지향은 정의할 때this의 지향이고, 정의할 때this의 지향은 구조 함수의 실례, 즉 newfactory () 이다.newfactory () 의 실례는 위의 a입니다.

{
    let factory = function () {
        this.a = 'a';
        this.b = 'b';
        this.c =  {
            a: "a+",
            b: () => {
                return this.a;
            }
        }
    };
    console.log(new factory().c.b());
}