Maison > interface Web > js tutoriel > Exemple de code de la méthode bind en JavaScript

Exemple de code de la méthode bind en JavaScript

不言
Libérer: 2019-03-11 16:27:34
avant
2538 Les gens l'ont consulté

Cet article vous apporte des exemples de code sur la méthode bind en JavaScript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

appel, candidature et nouveau ont déjà été mis en œuvre. À propos, bind est également implémenté aujourd'hui.
Tout d'abord :

  1. La méthode bind renvoie une fonction liée à celle-ci, et la fonction n'est pas exécutée et doit être appelée manuellement. (De ce point de vue, la fonction bind est une fonction d'ordre supérieur et elle est différente des méthodes call et apply).
  2. La méthode bind peut lier ceci et transmettre des paramètres. Notez que ce paramètre peut être transmis plusieurs fois.
  3. Si la fonction liée par bind est nouvelle, alors le pointeur this changera à ce moment-là. Il s'agit à ce moment de l'instance de la fonction actuelle.
  4. Les propriétés et méthodes sur le constructeur sont disponibles sur chaque instance.

ok, le code ci-dessus~

Function.prototype.mybind = function(context){
    let that = this;
    let args1 = Array.prototype.slice.call(arguments,1);
    let bindFn = function(){
        let args2 = Array.prototype.slice.call(arguments);
        return that.apply(this instanceof bindFn?this:context,args1.concat(args2)); 
    }
    let Fn = function(){};
    Fn.prototype = this.prototype;
    bindFn.prototype = new Fn();
    return bindFn;
}
Copier après la connexion

Tout d'abord, récupérez le premier paramètre passé args1, et interceptez-le ici car le premier paramètre est celui-ci. Ensuite, une fonction bindFn est déclarée, dans laquelle le deuxième paramètre passé args2 est obtenu et son exécution est renvoyée. Le "cela" ici est la fonction d'origine. Faites attention au jugement lors de l'exécution de la fonction d'origine et de la liaison de la fonction d'origine "ceci". S'il s'agit d'une instance produite par le constructeur bindFn new, alors il doit s'agir ici de l'instance elle-même. Au contraire, c'est this(context) passé par la méthode bind. Enfin, connectez les paramètres obtenus deux fois via concat() et transmettez-les, réalisant ainsi les trois premiers éléments.
Dernier élément : Les propriétés et méthodes du constructeur sont disponibles sur chaque instance. Ici, une fonction intermédiaire Fn est utilisée pour connecter la chaîne prototype. Le prototype de Fn est égal au prototype de celui-ci. Fn et this pointent vers le même objet prototype. Le prototype de bindFn est égal à l’instance de Fn. Le __proto__ de l'instance Fn pointe vers le prototype de Fn. Autrement dit, le prototype de bindFn pointe vers le même prototype que celui-ci, pointant vers le même objet prototype. À ce stade, vous avez implémenté votre propre méthode de liaison.
Le code est écrit, testons-le~

Function.prototype.mybind = function(context){
Laissez cela = ceci ;
Soit args1 = Array.prototype.slice.call(arguments,1);
Soit bindFn = function(){
Soit args2 = Array.prototype.slice.call(arguments);
        return that.apply(this instanceof bindFn?this:context,args1.concat(args2));
}
Soit Fn = function(){};
Fn.prototype = this.prototype;
bindFn.prototype = new Fn();
Renvoie bindFn;
}

soit obj = {
nom: 'tigre'
}

fonction fn(nom,âge){
This.say = 'Woof wow~';
console.log(this);
Console.log(this.name+'raised one'+name+','+age+'ans');
}

/**Paramètres de passage pour la première fois*/
laissez bindFn = fn.mybind(obj,'
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:segmentfault.com
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