javascript - globales - Establecer "esta" variable fácilmente?

variable scope

Question

Tengo una comprensión bastante buena de Javascript, excepto que no puedo encontrar una buena manera de establecer la variable "this". Considerar:

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

¿Hay alguna manera de hacer esto sin las últimas 4 líneas? Es bastante molesto ... He intentado enlazar una función anónima, que pensé que era hermosa e inteligente, pero fue en vano:

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.

Obviamente, pasar la variable a myFunction es una opción ... pero ese no es el punto de esta pregunta.

Gracias.

Answer 1

Creo que estás buscando una call :

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

Esto llama myFunction con this conjunto a obj .

También se apply método ligeramente diferente, que toma los parámetros de la función como una matriz:

myFunction.apply(obj, [arg1, arg2, ...]);

Answer 2

Hay dos métodos definidos para todas las funciones en JavaScript, call() y apply() . La sintaxis de la función se ve así:

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

Lo que estas funciones hacen es llamar a la función en la que se invocaron, asignando el valor del parámetro del objeto a esto .

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

Answer 3

Mi búsqueda sobre cómo enlazar this me trajo aquí, así que estoy publicando mis hallazgos: en ''ECMAScript 2015'' también podemos establecer esto léxicamente usando las funciones de flecha para.

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

En lugar de:

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);
}

Ahora podemos hacer:

function Person(){
  this.age = 0;

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

var p = new Person();

Answer 4

Si desea ''almacenar'' this valor en una función para que pueda llamarlo sin problemas más tarde (por ejemplo, cuando ya no tenga acceso a ese valor), puede bind (aunque no está disponible en todos los navegadores):

var bound = func.bind(someThisValue);

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

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