ES6 화살표 함수는 'this' 키워드를 어떻게 처리합니까?

ES6의 화살표 함수와 "this"의 어휘 바인딩

ES6의 화살표 함수의 특징 중 하나는 독특한 처리 방식입니다. "this" 키워드 중 하나입니다. "this"를 함수의 호출 컨텍스트에 동적으로 바인딩하는 일반 함수와 달리 화살표 함수는 "this"를 포함하는 어휘 범위에 어휘적으로 바인딩합니다.

즉, 화살표 함수 내의 "this"는 항상 개체를 참조합니다. 화살표 함수 정의가 포함되어 있습니다. 예:

var testFunction = () => {
  console.log(this);
};

testFunction();

이 코드에서 화살표 함수 내의 "this"는 추측한 대로 굵은 화살표 함수 자체를 참조하지 않습니다. 대신 화살표 함수 정의가 포함된 개체를 참조합니다. 화살표 함수는 전역 범위 내에서 정의되므로 "this"는 전역 컨텍스트를 갖습니다. 따라서 코드의 출력은 전역 개체가 됩니다.

어휘 바인딩은 함수 실행 중에 "this" 값이 변경될 가능성이 있는 상황에서 유용합니다. 예를 들어, 다음 예를 고려하십시오.

function Person() {
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| properly refers to the person object
  }, 1000);
}

var p = new Person();

이 예에서 화살표 함수는 둘러싸는 Person 객체의 "this" 값을 캡처합니다. 이렇게 하면 setTimeout 콜백이 비동기적으로 호출되고 실행 컨텍스트가 변경된 경우에도 항상 올바른 개인 인스턴스에서 증분 작업이 수행됩니다.

요약하자면 ES6의 화살표 함수는 "this"를 어휘적으로 바인딩합니다. 어휘 범위를 포함합니다. 이를 통해 "this"가 함수의 호출 컨텍스트에 관계없이 동일한 개체를 참조할 수 있으므로 비동기 또는 중첩 함수 시나리오에서 "this"를 더 쉽게 처리할 수 있습니다.

위 내용은 ES6 화살표 함수는 'this' 키워드를 어떻게 처리합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!