我一直在努力使用.bind()方法使用这些“this”并使用变量“self = this”.在获得两个不同的结果时,我错过了一个概念.案例如下：
// Defining a callback class to use after retrieving data
var Callback = (function(){
// UPDATED!! Local vbles
var template_to_use,html_element,self;
function Callback(){
self = this,template_to_use = null,html_element = null;
}
var p = Callback.prototype;
p.set_template = function(template_funct){
self.template_to_use = template_funct;
};
p.set_html_element = function(html_element){
self.html_element = html_element;
};
p.use_callback = function(data){
$(self.html_element).append(self.template_to_use(data));
};
return Callback;
})();
// Setup callback 1 to call after getting the data
var callback_1 = new Callback();
callback_1.set_template(use_templ_1);
callback_1.set_html_element("#list");
// Get list data
api_list.get_data(callback_1.use_callback);
// Setup callback 2 to call after getting more data
var callback_2 = new Callback();
callback_2.set_template(use_templ_2);
callback_2.set_html_element("#object");
// Get object data
api_object.get_data(callback_2.use_callback);
执行两个ajax调用,一旦get_data()函数完成,它们将调用我传递给它们的回调函数.我得到的问题是,在执行这些函数之后,回调总是提到带有相应模板“use_templ_2”的html_element =“#object”.
如果我使用“this”和.bind函数而不是“self”vble,结果就是预期的结果.
// Get object data api_object.get_data(callback_2.use_callback.bind(callback_2));
我错过了什么？这可能是一个错误的概念,因为即使我不是js的新手,我也是新的理解语言本身.
解决方法
小心,self会始终引用最后一个instanciated对象：
var c1 = new Callback(); var c2 = new Callback(); // overrides prevIoUs self
然后以下行实际设置c2.html_element：
c1.set_html_element(html_element);
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures
也就是说,在您的情况下,替换它是完全没用的.
