2012-02-24 2 views
2

다음과 같이 JavaScript 개체를 만들려고합니다.다른 컨텍스트에서 JavaScript 'this'

var MyObject = function (parameters) { 
    this.parameters = parameters; 
    parameters.userFunction(this.MyObjectCallback); 
} 

MyObject.SOME_STATIC_VARIABLE = 21; 

MyObject.prototype = { 
    myObjectCallback: function() { 
     console.log(this); 
    } 
} 

MyObject 개체는 처리기를 전달할 userFunction을 허용합니다. 사용자 기능은 예를 들어, 일부 로직을하고 인스턴스에 다시 결과를 전달합니다 :

new MyObject({userFunction: function(callback) { 
    $.post(
     'http://localhost/~knyttl/source.php', 
     {}, 
     callback, 
     'json');, 
}}); 

불행하게도, callback가 제대로이라고하더라도, thisMyObject 인스턴스의 JQuery 개체의 인스턴스를 취득하지 내가 원했던대로. 결론적으로 나는 MyObject 인스턴스를 관리 할 수 ​​없습니다.

이것이 JavaScript 개체를 만드는 올바른 방법인지 여부는 확실하지 않습니다. 나는 어떤 제안에도 감사 할 것입니다.

답변

5

.bind을 사용하여 특정 this 값을 바인딩 할 수 있습니다. 또한 My의 대문자를 수정했습니다.

parameters.userFunction(this.myObjectCallback.bind(this)); 

당신이 a.b() 같은 함수를 호출

다음 내부 b, this === a. 그러나 이 아닌 경우은 직접 호출하지만 함수 (예 : a.b) 만 전달하고 나중에 호출하면이 바인딩이 손실됩니다.

.bind은 이제 jQuery 아약스 결과를받는 새로운 함수를 this으로 반환합니다. 그러나이를 무시하고 myObjectCallback을 미리 정의 된 (바운드) this으로 호출합니다.

.bind은 구형 브라우저에서는 사용할 수 없지만 사용 가능한 심이 있습니다.

0

jQuery를 사용하면 콜백의 context을 설정할 수 있습니다.

디자인이 이상한 상황에 처해 있습니다. MyObject는 동시에 생성되기 때문에 컨텍스트로 전달 될 수 없습니다.

new MyObject({userFunction: function(callback) { 
    $.post(
     'http://localhost/~knyttl/source.php', 
     {}, 
     callback, 
     'json');, 
}}); 

그래서 그 대신 :

var myObj = new MyObejct(); 
myObj.setCallback({userFunction: function (callback) { 
    $.ajax({ 
     context: myObj, 
     url: 'http://localhost/what ever /', 
     success: callback, 
     dataType: 'json', 
     data: {} 
    } 
}); 
0

은 매우 혼란 될 가능성이있다. 함수가 호출 될 때 점 뒤에있는 값이 할당됩니다.

window.doSomething(); 

가이 myDOMElement가 설정되도록한다

myDOMElement.onClick(); 

반면, 윈도우로 설정되게된다. 귀하의 경우에는

, 그것은 jQuery의 내부 동작에 이르기까지, 그래서 JQuery와 을 처리하는 방법에 대한 이해를 얻을 수 this very thorough set of explanations에서 봐 가지고 온다.

관련 문제