`bind()`가 화살표 함수 `this`와 작동하지 않는 이유는 무엇입니까?

애로우 함수에서 'this' 바인딩에 대한 수수께끼: 수수께끼 공개

화살표 함수의 매혹적인 단순함에도 불구하고 'this'에 대한 불가해한 동작 이'는 많은 개발자들을 당황하게 만들었습니다. 화살표 함수 내에서 'this'를 특정 컨텍스트에 바인딩할 수 없다는 점은 반복되는 불만의 원인이 되었습니다.

딜레마를 설명하려면 다음 코드를 고려하세요.

const f = () => console.log(this);

const o = { a: 42 };

const fBound = f.bind(o);

fBound(); // Expected: { a: 42 }, Actual: { window: Window }

이 예에서 , 'bind()' 메소드를 사용하여 화살표 함수 'f'의 'this' 컨텍스트를 객체 'o'에 바인딩하려고 시도합니다. 그러나 'fBound()'를 호출하면 예상되는 'o' 객체 대신 전역 'window' 객체가 기록되는 이유는 알 수 없습니다.

이 당황스러운 동작은 화살표 함수의 고유한 특성에 뿌리를 두고 있습니다. 자체 'this' 컨텍스트가 있는 일반 함수와 달리 화살표 함수는 주변 어휘 범위에서 'this' 바인딩을 상속합니다. 이 경우 'f'는 전역 범위 내에서 정의되어 전역 'window' 객체에 바인딩된 'this'를 렌더링합니다.

ECMAScript 2015 사양에는 다음과 같이 확실하게 명시되어 있습니다.

"다음에 대한 참조는 다음과 같습니다. ArrowFunction 내의 인수, super, this 또는 new.target은 어휘적으로 둘러싸는 환경의 바인딩으로 해석되어야 합니다."

따라서, 화살표 함수 내에서 'this'를 다시 바인딩하는 것은 불가능해집니다. 'this'는 화살표 함수가 정의된 컨텍스트에 영원히 고정되어 있습니다.

'this'의 의미 있는 사용이 코드에 중요하다면 신중한 조치는 화살표 함수 대신 일반 함수를 활용하는 것입니다. 화살표 기능. 일반 함수는 'this' 바인딩을 더 강력하게 제어할 수 있으므로 'bind()' 또는 다른 방법을 사용하여 'this'를 원하는 컨텍스트에 명시적으로 바인딩할 수 있습니다.

위 내용은 `bind()`가 화살표 함수 `this`와 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!