ES6 화살표 함수의this 깊이 이해

간략하게 소개: 화살표 함수 중의this는 일반function이 정의한 함수와 달리 어지럽기 쉽다. 화살표 함수this의 정의: 화살표 함수 중의this는 함수를 정의할 때 귀속되는 것이지 함수를 실행할 때 귀속되는 것이 아니다.
1. 정의할 때 귀속
다음 예를 살펴보겠습니다.
(1)

var x=11;
var obj={
  x:22,
  say:function(){
    console.log(this.x)
  }
}
obj.say();
//console.log 22

일반적인 정의 함수는 우리의 이해와 같다. 실행할 때this의 지향을 결정하고obj를 실행할 때 알 수 있다.say () 때,this는 obj라는 대상을 가리킨다.
(2)

var x=11;
var obj={
 x:22,
 say:()=>{
   console.log(this.x);
 }
}
obj.say();
// 11

이렇게 하면 이상하다. 만약에 이전의 function 정의에 따라 출력해야 할 것이 22이고 이때 11을 출력했다면 ES6의 화살표 함수 중의this는 정의할 때의 귀속이라는 것을 어떻게 설명합니까?
이른바 정의시 귀속,this는 아버지가 실행하는 상하문을 계승하는 것!!의this, 예를 들어 여기 화살표 함수의this.x, 화살표 함수 자체와say는 키:value의 형식, 즉 화살표 함수 자체가 있는 대상은obj이고obj의 부모 실행 상하문은 윈도우이기 때문에this.x는 실제로 윈도우를 나타낸다.x, 따라서 출력은 11입니다.(this는 함수에서 호출되거나 구조 함수 new Object () 형식을 통해서만 this가 가능)
이와 유사한 것은 다음과 같다.
(3)

var a=11
function test1(){
  this.a=22;
  let b=function(){
    console.log(this.a);
  };
  b();
}
var x=new test1();
 11

화살표 함수 상황:

var a=11;
function test2(){
  this.a=22;
  let b=()=>{console.log(this.a)}
  b();
}
var x=new test2();
// 22

이상하지 않아요? 저는 이렇게 이해합니다. ES6에서 정의할 때this의 구체적인 의미를 귀속시키고 계승해야 할 것은 아버지 집행 상하문 안의this입니다. 아버지 집행 상하문은 절대 피하세요!!!이렇게 하면 많은 화살표 함수 중의 지향이 명확하지 않으면 쉽게 풀린다.
주의: 간단한 대상(비함수)은 상하문을 실행하지 않습니다!
2017년 8월 13일 보충:
화살표 함수에서this가 가리키는 고정화는 화살표 함수 내부에this가 귀속되어 있기 때문이 아니다
메커니즘, 실제 원인은 화살표 함수에 자신의this가 아예 없기 때문에 내부의this가 바로 밖이다
레이어 코드 블록의this.바로this가 없기 때문에 구조 함수로 사용할 수 없습니다.
ES5의 화살표 함수 변환을 시뮬레이션할 수 있습니다.

// ES6
function foo() {
  setTimeout(() => {
    console.log('id:', this.id);
  }, 100);
}

// ES5
function foo() {
  var _this = this;

  setTimeout(function () {
    console.log('id:', _this.id);
  }, 100);
}

그래서 대상을 정의할 때 대상의 속성을 정의하는데 그 안에 있는this가 가리키는 것은 일반적으로 전체 국면이나 이 대상이 있는 그 환경에서의this이다.