我一直在努力使用.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));
解决方法
小心,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
也就是说,在您的情况下,替换它是完全没用的.
原文地址:https://www.jb51.cc/js/151406.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。