JavaScript에서 Bind() 메서드가 필수적인 이유는 무엇입니까?

자바스크립트 바인드()는 왜 필요한가요?

문제 및 해결방법

자바스크립트에서는, this 키워드는 함수가 호출되는 객체를 나타냅니다. 그러나 함수가 변수에 할당된 다음 간접적으로 호출되면 this 값을 예측할 수 없습니다. 이로 인해 "이것은 정의되지 않았습니다." 또는 "이것은 전역 개체입니다."와 같은 오류가 발생할 수 있습니다.

이 문제를 해결하기 위해 JavaScript는 바인딩() 메서드를 제공합니다. 바인딩(객체)을 호출하면 나중에 호출되는 경우에도 함수에 대한 this 값을 명시적으로 설정할 수 있습니다. 이렇게 하면 this 값이 예기치 않게 변경되는 것을 방지할 수 있습니다.

문제가 발생하는 이유

앞서 설명했듯이 this 값은 호출 컨텍스트에 따라 결정됩니다. 함수가 직접 호출되면 this 값은 단순히 해당 함수가 호출된 객체입니다. 그러나 함수가 변수에 할당되면 원래 호출 컨텍스트가 손실됩니다.

예제 1

<code class="js">this.name = "John";

var myName = {
  name: "Tom",
  getName: function() {
    return this.name
  }
}

var storeMyName = myName.getName;</code>

예제 1에서 storeMyName은 다음에 대한 참조입니다. getName 함수. storeMyName이 호출되면 myName 객체 내의 원래 컨텍스트가 손실됩니다. 따라서 storeMyName 내부의 이 객체는 myName 객체가 아닌 전역 객체를 참조합니다.

솔루션(바인드)

<code class="js">var storeMyName2 = myName.getName.bind(myName);</code>

예제 2에서는 바인딩()이 사용되었습니다. getName의 이 값을 myName 객체에 명시적으로 설정합니다. 이렇게 하면 storeMyName2가 호출될 때 전역 개체가 아닌 myName 개체를 참조하게 됩니다.

예제 3이 문제를 해결하는 이유

<code class="js">var storeMyName3 = myName.getName();</code>

예 3 변수에 함수를 할당하지 않기 때문에 다른 것과 다릅니다. 대신 myName.getName()을 직접 호출하고 결과를 storeMyName3에 저장합니다. 이는 storeMyName3이 함수가 아니라 getName 함수에서 반환된 값임을 의미합니다. 따라서 이 값에 대해 걱정할 필요가 없습니다.

위 내용은 JavaScript에서 Bind() 메서드가 필수적인 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!