Maison > interface Web > js tutoriel > le corps du texte

Introduction à la méthode prototype.bind() dans les connaissances JavaScript_Basic

WBOY
Libérer: 2016-05-16 16:53:20
original
1208 Les gens l'ont consulté

Dans le passé, vous pouviez directement définir self=this ou that=this, etc., ce qui bien sûr fonctionnerait, mais utiliser Function.prototype.bind() serait mieux et aurait l'air plus professionnel.
Voici un exemple simple :

Copier le code Le code est le suivant :

var myObj = {
fonction spéciale : function () {
},
anotherSpecialFunction : function () {
},
getAsyncData : function (cb) {
cb();
},
render : function () {
var that = this;
this.getAsyncData(function () {
that.specialFunction();
that.anotherSpecialFunction();
});
>
};
myObj.render();

Dans cet exemple, afin de maintenir le contexte myObj, une variable that=this est définie, ce qui est faisable, mais Function .prototype n'est pas utilisé .bind() semble plus soigné :
Copier le code Le code est le suivant :

render : function() {
this.getAsyncData(function () {
this.specialFunction();
this.anotherSpecialFunction();
}.bind(this));
}

Lors de l'appel de .bind(), il créera simplement une nouvelle fonction et la transmettra à cette fonction. Le code pour implémenter .bind() ressemble à peu près à ceci :

Copiez le code Le code est le suivant :
Function.prototype .bind = function (scope) {
var fn = this;
return function () {
return fn.apply(scope);
};
}

Regardons un exemple simple d'utilisation de Function.prototype.bind() :

Copier le code Le code est le suivant :

var foo = {
x : 3
};

var bar = function(){
console.log(this.x);
};

bar(); // non défini

varboundFunc = bar.bind(foo);

boundFunc(); // 3

N'est-ce pas très utile ! Malheureusement, les navigateurs IE IE8 et inférieurs ne prennent pas en charge Function.prototype.bind(). Les navigateurs pris en charge sont Chrome 7, Firefox 4.0, IE 9, Opera 11.60, Safari 5.1.4. Bien que les navigateurs tels que IE 8/7/6 ne le prennent pas en charge, l'équipe de développement de Mozilla a écrit une fonction avec des fonctions similaires pour les anciennes versions des navigateurs IE. Le code est le suivant :

Copiez le code Le code est le suivant :

if (!Function.prototype.bind) {
  Function.prototype.bind = function (oThis) {
    if (typeof this !== "function") {
      // ce qui se rapproche le plus de la fonction IsCallable interne d'ECMAScript 5
      throw new TypeError("Function.prototype.bind - ce qui essaie d'être lié n'est pas appelable");
    }

    var aArgs = Array .prototype.slice.call(arguments, 1),
        fToBind = this,
        fNOP = function () {},
        fBound = function () {
          return fToBind.apply (cette instance de fNOP && oCeci
                                 ? ce
                                : oCeci,
                              a Args.concat(Array.prototype.slice.call(arguments)));
        };

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

    return fBound;
  };
}

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal