web-dev-qa-db-fra.com

Comment gérer l'absence de méthode JavaScript Object.bind () dans IE 8

J'écris un peu de JavaScript qui utilise la méthode 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);
};

Depuis que je développe sous WinXP avec Firefox et que je teste parfois sous Win7 avec IE 9 ou 10, je n’ai pas remarqué ni fait attention au fait que IE8 et les versions antérieures ne supportent pas bind.

Ce script particulier n'utilise pas le canevas, je suis donc un peu hésitant à écrire sur tous les utilisateurs de IE 8. 

Existe-t-il une solution de rechange standard?

Je me débrouille assez bien en JavaScript, mais je suis encore un peu un noob. Alors pardonnez-moi si la solution est totalement évidente. 

javascriptinternet-explorer-8cross-browserbindbackwards-compatibility
24
Claude

Il y a un bon script de compatibilité sur cette page: https://developer.mozilla.org/fr/JavaScript/Reference/Global_Objects/Function/bind

Il suffit de copier et coller dans votre script.

EDIT: plaçant le script ci-dessous pour plus de clarté.

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;
  };
}
49
alexwells

La meilleure solution pourrait être d'installer Modernizr . 

Modernizr vous indique si cette fonctionnalité est implémentée ou non dans le navigateur actuel Elle fournit un programme de chargement de scripts vous permettant d’utiliser des fonctions de remplissage multiple pour remplacer les fonctionnalités des anciens navigateurs. 

Voici le lien pour générer votre version personnalisée modernizr:
http://modernizr.com/download/#-teststyles-testprop-testallprops-hasevent-prefixes-domprefixes

4
antonjs

Function.prototype.bind n’est pas pris en charge dans Internet Explorer 8 et versions ultérieures. Tableau de compatibilité ici: http://kangax.github.io/es5-compat-table/

Mozilla Developer Network fournit cette alternative aux navigateurs plus anciens qui n’implémentent pas nativement .bind ():

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;
  };
}
2
Karl Glennon

Le constructeur de fonction est la méthode traditionnelle:

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

Références

0
Paul Sweatte