Cómo manejar la falta de método Object.bind() de JavaScript en IE 8

Question

Estoy escribiendo un poco de JavaScript que usa el método Object.bind.

funcabc = function(x, y, z){ 
    this.myx = x; 
    this.playUB = function(w) { 
     if (this.myx === null) { 
      // do blah blah 
      return; 
     } 

     // do other stuff 
    }; 
    this.play = this.playUB.bind(this); 
}; 

Desde que se desarrollan en WinXP con Firefox y, a veces de prueba en Win7 con IE 9 o 10, no se dio cuenta o prestar atención al hecho de que IE8 y por debajo no son compatibles con bind.

Esta secuencia de comandos particular no utiliza el lienzo, por lo que estoy un poco indeciso de cancelar todos los usuarios de IE 8.

¿Existe una solución estándar?

Me estoy poniendo bastante bien en JavaScript, pero todavía soy un poco novato. Entonces, perdónenme si la solución es totalmente obvia.

Answer 1

Hay un buen guión de compatibilidad en esta página: https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Function/bind

sólo debes copiar y pegar en su guión.

EDIT: colocando la secuencia de comandos a continuación para mayor claridad.

if (!Function.prototype.bind) { 
    Function.prototype.bind = function(oThis) { 
    if (typeof this !== 'function') { 
     // closest thing possible to the ECMAScript 5 
     // internal IsCallable function 
     throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable'); 
    } 

    var aArgs = Array.prototype.slice.call(arguments, 1), 
     fToBind = this, 
     fNOP = function() {}, 
     fBound = function() { 
      return fToBind.apply(this instanceof fNOP && oThis 
       ? this 
       : oThis, 
       aArgs.concat(Array.prototype.slice.call(arguments))); 
     }; 

    fNOP.prototype = this.prototype; 
    fBound.prototype = new fNOP(); 

    return fBound; 
    }; 
} 

Answer 2

La mejor solución podría ser la instalación de Modernizr.

Modernizr le dice si el navegador actual tiene esta característica implementada de forma nativa o no y proporciona un gestor de scripts para que pueda incorporar polyfills a la funcionalidad de relleno en buscadores antiguos.

Aquí está el enlace para generar su versión personalizada Modernizr:
http://modernizr.com/download/#-teststyles-testprop-testallprops-hasevent-prefixes-domprefixes

Answer 3

El constructor función es la forma tradicional de hacer esto:

var foo = function(x,y,z){ return Function("x,y,z","return Math.max.call(this, x, y, z)")(x,y,z) } 
 
    
 
var bar = function(x,y,z){ return Function("x,y,z","return Math.min.call(this, x, y, z)")(x,y,z) } 
 
    
 
console.log(foo(1,2,3)); 
 
    
 
console.log(bar(3,2,1));

Referencias

• Functional JavaScript: Harnessing the power of the Function Object
• eval() isn’t evil, just misunderstood
• [Scope] of Functions Created via the Function constructor
• John Resig - Fast JavaScript Max/Min

Answer 4

Function.prototype.bind no es compatible en Internet Explorer 8 y por debajo. Tabla de compatibilidades aquí: http://kangax.github.io/es5-compat-table/

Mozilla Developer Network proporciona esta alternativa para los navegadores antiguos que no implementan .bind() de forma nativa:

if (!Function.prototype.bind) { 
    Function.prototype.bind = function (oThis) { 
    if (typeof this !== "function") { 
     // closest thing possible to the ECMAScript 5 internal IsCallable function 
     throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable"); 
    } 

    var aArgs = Array.prototype.slice.call(arguments, 1), 
     fToBind = this, 
     fNOP = function() {}, 
     fBound = function() { 
      return fToBind.apply(this instanceof fNOP && oThis 
           ? this 
           : oThis, 
           aArgs.concat(Array.prototype.slice.call(arguments))); 
     }; 

    fNOP.prototype = this.prototype; 
    fBound.prototype = new fNOP(); 

    return fBound; 
    }; 
}