JavaScript 객체의 메서드를 전달해도 객체가 업데이트되지 않는 이유는 무엇입니까?

Question

개체의 메서드 (개체의 속성 중 하나를 업데이트 함)를 다른 함수의 인수로 전달하면 원래 개체가 수정되지 않는다는 것을 알게되었습니다. 예를 들어

:

var obj = { 
    foo: 0, 
    bar: function() { 
     this.foo++; 
    } 
}; 

function baz(callback) { 
    callback(); 
} 

baz(obj.bar); // does not alter obj 
obj.bar(); // increments obj.foo successfully 
console.log(obj.foo); // should be 2, not 1 

왜 자바 스크립트 객체 참조에 의해 전달되기 때문에이있다? 또는 this 값 - -

Answer 1

이는 상황이다 함수의이 가되지는 이 정의의 방법에 대한라고 얼마나을 기반으로합니다. bar 함수는 obj 개체 안에 있음을 알지 못합니다.

당신이 obj.bar();을

, 당신은 따라서 this 당신이 기대하는 것입니다, obj의 맥락에서 을 요구하고있다.

baz(obj.bar);을 수행하면 bar 함수가 매개 변수로 전달됩니다. 더 이상 obj 개체와 관련이 없습니다. 함수는 변수처럼 취급 될 수 있음을 기억하십시오. 따라서 baz이 콜백을 실행하면 "글로벌"컨텍스트 (this은 window)에서 실행됩니다.

여기서의 해결책은 .bind()을 사용하여 this 값을 "고정"하는 것입니다.

baz(obj.bar.bind(obj)); 

Answer 2

콜백을 특정 개체에 바인딩해야하기 때문에. 같은 식의 호출을 수행 할 때

baz(obj.bar.bind(obj)); 

기능은 자동으로 . 전에 개체에 바인딩됩니다. 속성에 액세스하기 만하면 바인딩되지 않습니다.