设置“这个”变量很容易吗？

我对 Javascript 有很好的理解，除了我不能找到一个很好的方法来设置“ this”变量。考虑一下:

var myFunction = function(){
alert(this.foo_variable);
}


var someObj = document.body; //using body as example object
someObj.foo_variable = "hi"; //set foo_variable so it alerts


var old_fn = someObj.fn;   //store old value
someObj.fn = myFunction;   //bind to someObj so "this" keyword works
someObj.fn();
someObj.fn = old_fn;       //restore old value

有没有办法不用最后四句台词？这很烦人... ... 我试过绑定一个匿名函数，我认为它很漂亮，也很聪明，但是没有用:

var myFunction = function(){
alert(this.foo_variable);
}


var someObj = document.body;        //using body as example object
someObj.foo_variable = "hi";        //set foo_variable so it alerts
someObj.(function(){ fn(); })();    //fail.

显然，将变量传递到 myFunction 是一个选项... ... 但这不是问题的关键。

谢谢。

66140 次浏览
小开

我想你要找的是 call:

myFunction.call(obj, arg1, arg2, ...);

这会在 this设置为 obj的情况下调用 myFunction。

还有一种略有不同的方法 apply，它将函数参数作为一个数组:

myFunction.apply(obj, [arg1, arg2, ...]);
小开
最佳答案

在 JavaScript、 call()和 apply()中，为所有函数定义了两个方法。函数语法如下:

call( /* object */, /* arguments... */ );
apply(/* object */, /* arguments[] */);

这些函数的作用是调用调用它们的函数，将 对象参数的值赋给 这个。

var myFunction = function(){
alert(this.foo_variable);
}
myFunction.call( document.body );
小开

如果你想把 this值“存储”到一个函数中，这样以后你就可以无缝地调用它(例如，当你不能再访问这个值的时候) ，你可以把它 bind(虽然不是所有的浏览器都可以使用) :

var bound = func.bind(someThisValue);


// ... later on, where someThisValue is not available anymore


bound(); // will call with someThisValue as 'this'
小开

关于如何绑定 this的搜索带我来到这里，所以我发布了我的发现: 在“ ECMAScript 2015”中，我们也可以使用箭头函数来设置这个词汇。

见: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Functions/Arrow_functions

而不是:

function Person() {
setInterval(function growUp() {
// The callback refers to the `self` variable of which
// the value is the expected object.
this.age++;
}.bind(this), 1000);
}

我们现在可以做的是:

function Person(){
this.age = 0;


setInterval(() => {
this.age++; // |this| properly refers to the person object
}, 1000);
}


var p = new Person();
小开

在 javascript 中设置 this关键字。

Javascript 有3个内置的方法，可以方便地设置 this关键字。它们都位于 Function.prototype对象上，因此每个函数都可以使用它们(因为每个函数都通过原型继承从这个原型继承)。这些职能如下:

  1. Function.prototype.call(): 这个函数接受要用作 this的对象作为第一个参数。其余的参数是被调用的函数的各自参数。
  2. Function.prototype.apply(): 这个函数接受要用作 this的对象作为第一个参数。然后第二个参数是一个数组，它包含被调用函数的参数的值(数组的第一个元素是函数的第一个参数，数组的第二个参数是函数的第二个参数，等等)。
  3. Function.prototype.bind(): 这个函数返回一个新函数，该函数的值与 this不同。它将要设置为 this值的对象作为第一个参数，然后返回一个新的函数对象。

呼叫/申请和绑定的区别:

  • call和 apply是相似的，因为它们是 立即调用函数(具有预定义的值 this)
  • bind不同于 call和 apply，事实上这个函数 返回一个新函数具有不同的 this值绑定。

例子:

const thisObj = {
prop1: 1,
prop2: 2,
};


function myFunc(arg1, arg2) {
console.log(this.prop1, this.prop2);
console.log(arg1, arg2);
}


// first arg this obj, other arguments are the
// respective arguments of the function
myFunc.call(thisObj, 'Call_arg1', 'Call_arg2');


// first arg this obj, other argument is an array which
// are the respective arguments of the function
myFunc.apply(thisObj, ['Apply_arg1', 'Apply_arg2']);




// the bind method returns a new function with a different
// this context which is stored in the newMyFunc variable
const newMyFunc = myFunc.bind(thisObj);


// now we can call the function like a normal function
newMyFunc('first', 'second');


提交答案