[英]How do I pass the this context to a function?
I thought this would be something I could easily google, but maybe I'm not asking the right question...我认为这将是我可以轻松谷歌的东西,但也许我没有问正确的问题......
How do I set whatever "this" refers to in a given javascript function?如何在给定的 javascript 函数中设置“this”所指的内容?
for example, like with most of jQuery's functions such as:例如,与大多数 jQuery 函数一样,例如:
$(selector).each(function() {
//$(this) gives me access to whatever selector we're on
});
How do I write/call my own standalone functions that have an appropriate "this" reference when called?如何编写/调用我自己的独立函数,这些函数在调用时具有适当的“this”引用? I use jQuery, so if there's a jQuery-specific way of doing it, that'd be ideal.
我使用 jQuery,所以如果有一种特定于 jQuery 的方法,那将是理想的。
Javascripts .call()
and .apply()
methods allow you to set the context for a function. Javascript 的
.apply()
.call()
和.apply()
方法允许您设置函数的上下文。
var myfunc = function(){
alert(this.name);
};
var obj_a = {
name: "FOO"
};
var obj_b = {
name: "BAR!!"
};
Now you can call:现在你可以调用:
myfunc.call(obj_a);
Which would alert FOO
.这会提醒
FOO
。 The other way around, passing obj_b
would alert BAR!!
obj_b
,传递obj_b
会提醒BAR!!
. . The difference between
.call()
and .apply()
is that .call()
takes a comma separated list if you're passing arguments to your function and .apply()
needs an array.之间的差异
.call()
和.apply()
是.call()
需要,如果你将参数传递给你的函数,并用英文逗号分隔.apply()
需要一个数组。
myfunc.call(obj_a, 1, 2, 3);
myfunc.apply(obj_a, [1, 2, 3]);
Therefore, you can easily write a function hook
by using the apply()
method.因此,您可以使用
apply()
方法轻松编写函数hook
。 For instance, we want to add a feature to jQuerys .css()
method.例如,我们想向 jQuery 的
.css()
方法添加一个功能。 We can store the original function reference, overwrite the function with custom code and call the stored function.我们可以存储原始函数引用,用自定义代码覆盖函数并调用存储的函数。
var _css = $.fn.css;
$.fn.css = function(){
alert('hooked!');
_css.apply(this, arguments);
};
Since the magic arguments
object is an array like object, we can just pass it to apply()
.由于魔法
arguments
对象是一个类似对象的数组,我们可以将它传递给apply()
。 That way we guarantee, that all parameters are passed through to the original function.这样我们保证,所有参数都传递给原始函数。
Use function.call
: 使用
function.call
:
var f = function () { console.log(this); }
f.call(that, arg1, arg2, etc);
Where that
is the object which you want this
in the function to be. that
是您希望this
在函数that
所在的对象。
Another basic example:另一个基本示例:
NOT working:不工作:
var img = new Image;
img.onload = function() {
this.myGlobalFunction(img);
};
img.src = reader.result;
Working:在职的:
var img = new Image;
img.onload = function() {
this.myGlobalFunction(img);
}.bind(this);
img.src = reader.result;
So basically: just add .bind(this) to your function所以基本上:只需将 .bind(this) 添加到您的函数中
jQuery uses a .call(...)
method to assign the current node to this
inside the function you pass as the parameter. jQuery 使用
.call(...)
方法在您作为参数传递的函数中将当前节点分配给this
。
EDIT:编辑:
Don't be afraid to look inside jQuery's code when you have a doubt, it's all in clear and well documented Javascript.当您有疑问时,不要害怕查看 jQuery 的代码,所有内容都在清晰且有据可查的 Javascript 中。
ie: the answer to this question is around line 574,即:这个问题的答案在第 574 行左右,
callback.call( object[ name ], name, object[ name ] ) === false
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.