抱歉,主题标题不太好。不知道怎么命名。
我需要这个例子的帮助,我完全迷路了。
因此,当函数 fillView 被调用时,一切都很好,但是第二次当它被调用以重新调整大小时,它就不起作用了,因为在渲染函数内部“this”定义了一个窗口,而不是 localClass 的实例。我需要解释如何解决这个问题。请写一个例子。
(function ($) {
var localClass = function(options) {
this.a = 123;
};
localClass.prototype.render = function() {
console.log(this.a);
}
$.fn.fillView = function(options){
var view = new localClass(options);
view.render(); //this prints to console 123
$(window).resize(view.render); //this doesn't print 123
because 'this' is now - Window
}
})(jQuery)
最佳答案
替换
$(window).resize(view.render);
与
$(window).resize(function(){view.render()});
如果您只针对新浏览器(即您不需要与 IE8 兼容),您也可以使用 bind :
$(window).resize(view.render.bind(view));
工作原理:
1) 当您传递一个函数时,您只是将另一个属性的值设置为该函数。这就像做
var f = view.render.
当这个函数被调用时,它是这样调用的:
f();
那么函数中的 this
没有理由成为 view
可能会更清楚。在这里,实际上是 window
。更准确地说,函数中的 this
不是函数的初始“所有者”,而是接收者,这取决于您如何调用函数。
事实上,它可能是另一个对象:如果你执行
f.call(someObject)
然后 f
(即 render
)中的 this
将是 someObject
。
2) 但是当你传递一个函数时
var f = function(){ view.render() }
那么你如何调用 f
并不重要,因为 render
是用 view
作为接收者调用的。
3) 还有其他解决方案:bind
或 $.proxy
都构建了一个嵌入您的新函数但确保 this
始终是您传递的对象。
关于Javascript 实例上下文原型(prototype),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17534455/