Function bind

La función bind va en la línea de call y apply, actuar sobre el objeto this usado dentro del cuerpo de la función

Recordemos que una función pertence siempre a algún objeto (es su método) y dentro de la función this apunta a ese propietario.

A diferencia de call y apply, el método bind(nuevo_this, args) crea una función nueva con el mismo código que la función original. A esta nueva función se le pasan como argumentos el objeto al que debe apuntar this y otros con los que deba trabajar la función. Muy útil para eventos.

Puede parecer algo complicado pero no lo es tanto. Con este mínimo ejemplo creo que puede quedar claro.

Supongamos una función llmada Operar que tiene como argumentos dos valores. La operación que realize dependerá del objeto propietrio de esta función, o sea, del objeto this. Pues vamos a llamar a esta función con una función ligada mediante bind y los valores para operar.

var opSuma= function(x,y){return x+y};

var opResta= function(x,y){return x-y};

var opProducto = function(x,y){return x*y}

function Operar(a,b)
{
    return this(a, b);
}
var suma = Operar.bind(opSuma)(7,8);

var resta = Operar.bind(opResta, 17, 8)();

var multiplicar = Operar.bind(opProducto);

console.log("suma "+suma+" diferencia "+resta);

console.log("Producto: "+multiplicar(7,9) );

Operar.bind(nThis, args) es una función. El primer argumento es el objeto this dentro de Operar, el resto son los argumentos que se usen dentro de la función.

En el ejemplo puedes ver como los argumetnos para las funciones que harán de this se pueden escribir como argumetnos de bind o como argumentos de la función bind()(args). Incluso pueden ir separados entre ambas posiciones. En el ejemplo fíjate como se usa la función multiplicar.

No es que sea un ejemplo muy útil ni optimizado, pero ilustra la idea de bind y sus posiblidades, como pasar argumentos cuendo no se puede, como en una funcion callback.

El método bind() soluciona el problema de la descontextualización de un método, es decir, cuando el método pierde la referencia a su propietario y this queda indefinido. Por ejemplo observa este objeto contador

var contador = {

    valor: 0,

    inc: function () { return ++this.valor; }

}

console.log(contador.inc());  //1

console.log(contador.inc());  //2

console.log(contador.inc());  //3

Cada vez que se invoque contador.inc() devolverá un entero creciente. Pero observa si extraemos el método inc()

miCont = contador.inc;

miCont();    //NaN

var obj = {valor:0}

console.log( miCont.bind(obj)() )   //1

console.log( miCont.bind(obj)() )   //2

En el momento en que se vincula un nuevo objeto con this el nuevo contador miCont funciona correctamente.

Un par de detalles importantes: el objeto pasdo como nThis no puede ser sobreescrito, se pasa por valor. Y si tiene el valor undefined entonces no es considerado, como si no existiera, no afecta al this de la función.

scripts