Explication du code ninja de John Resig

Question

Function.prototype.bind = function(){ 
    var fn = this, args = Array.prototype.slice.call(arguments), 
     object = args.shift(); 
     return function(){ 
       return fn.apply(object, 
        args.concat(Array.prototype.slice.call(arguments))); 
     }; 
}; 


var myObject = {}; 
function myFunction(){ 
    return this == myObject; 
} 
assert(!myFunction(), "Context is not set yet"); 
var aFunction = myFunction.bind(myObject) 
assert(aFunction(), "Context is set properly"); 

Une petite modification du code de Jeffery m'a aidé à comprendre les arguments utilisés dans la fonction anonyme interne. Je viens de changer les 3 lignes ci-dessous

var introduce = function(greeting) { alert(greeting + ", my name is " + this.name + " ,home no is " + arguments[1]); } 

hiBob(" 456"); // alerts "Hi, my name is Bob" 
yoJoe(" 876"); 

Merci à tous

Answer 1

L'objet arguments est un objet semblable à un tableau, il a seulement la propriété de la longueur. L'appel de la fonction de découpage via Array.prototype est une technique courante pour la convertir en tableau. Vous pouvez donc directement utiliser les fonctions de tableau telles que shift et concat dans cet exemple.

Answer 2

Pour répondre à votre question, voici ce qui tranche ne

Array.slice(begin[,end]) La méthode tranche crée un nouveau tableau d'une section sélectionnée d'un tableau. Le tableau original est pas affecté par cette mais, si une chaîne ou un numéro dans un tableau est modifié, il ne se reflète pas dans l'autre, alors qu'un changement à un objet référencé peut être vu dans les deux objets Array. La méthode tranche utilise l'index de base zéro à déterminez la section à partir de laquelle créer le nouveau tableau. Il extrait pour inclure l'élément 'end' (si aucun 'end' n'est spécifié, le par défaut est le tout dernier élément). Le code suivant crée un tableau appelé « arbres » et affiche alors une « tranche » de : Code:

trees = ["oak", "ash", "beech", "maple", "sycamore"] 
document.write(trees.slice(1,4)) 

Sortie: frêne, hêtre, érable Si vous utilisez un indice négatif pour la « fin ', cela spécifie un élément tant de lieux de la fin. En continuant avec l'exemple ci-dessus, le code suivant afficherait le deuxième par l'intermédiaire du troisième au dernier éléments de la matrice:
code:

trees = ["oak", "ash", "beech", "maple", "sycamore"] 
document.write(trees.slice(1,-2)) 

sortie: frêne, hêtre

En ce qui concerne quelle tranche fait compte tenu du contexte actuel, CMS a la bonne réponse

Answer 3

Array.prototype.slice.call(arguments) crée un Array contenant tous les arguments passés à t il fonctionne.

Answer 4

Il transforme l'objet arguments en objet Array afin qu'il puisse appeler args.shift().

Les arguments objet est un objet en forme de tableau qui comporte 0 ou plusieurs propriétés d'index numériques et un length propriété

Answer 5

Ce code crée une nouvelle méthode sur le type Function nommée bind qui accepte une fonction libre en entrée et renvoie une fonction wrapper l'appelant comme s'il s'agissait d'une méthode sur l'objet spécifié. Ceci est assez similaire à la façon dont un délégué .Net encapsule une fonction et sa référence this associée.

De plus, si plus d'un argument est fourni à bind, ces arguments supplémentaires sont ajoutés à l'appel - cette technique est également appelée currying.

Pour essayer de l'expliquer de façon plus simple, pensez à quelque chose comme ceci:

var bob = { name: "Bob" }; 
var joe = { name: "Joe" }; 

var introduce = function(greeting) { alert(greeting + ", my name is " + this.name); } 

var hiBob = introduce.bind(bob, "Hi"); 
var yoJoe = introduce.bind(joe, "Yo"); 

hiBob(); // alerts "Hi, my name is Bob"