2017-09-09 3 views
0

Quelqu'un peut-il m'expliquer pourquoi je ne suis pas capable d'utiliser correctement la méthode apply sur un tableau de chaînes?Comment utiliser la méthode apply avec un tableau de chaînes?

function speak(line) { 
    console.log(line); 
} 
var whiteRabbit = {type: "white", speak: speak}; 
speak.apply(whiteRabbit, ["Burp!","Skree","Hello"]); 

La sortie est Burp, pourquoi ne pas tout le tableau? Et comment y parvenir avec la méthode d'application?

+0

qu'est-ce que fatRabbit? – marvel308

+0

désolé, il devrait être whiteRabbit .... comment puis-je corriger cela –

Répondre

1

Function#apply répartit le tableau en paramètres de fonctions, puisque votre seul paramètre est line, le premier élément du tableau lui est affecté et le reste est ignoré.

BTW - puisque la fonction speak n'utilise this en aucune façon, le 1er paramètre de apply n'a pas d'importance dans ce cas.

Si vous allez ajouter plus params à la fonction que vous pouvez voir comment cela fonctionne:

function speak(a, b, c) { 
 
    console.log(a, b, c); 
 
} 
 

 
speak.apply(null, ["Burp!","Skree","Hello"]);

Si vous avez besoin d'afficher un tableau de longueur inconnue, il est préférable d'invoquer la fonction en utilisant Function#call, puis itérer le tableau, ou le convertir en quelque chose de présentable. Par exemple:

function speak(arr) { 
 
    console.log(arr.join(' ')); 
 
} 
 

 
speak.call(null, ["Burp!", "Skree", "Hello", "Cats"]);

1

De Function#apply

Le apply() procédé appelle une fonction avec une donnée this valeur, et arguments fourni sous forme de tableau (ou un array-like object).

Vous ne prenez que le premier élément du tableau comme paramètre line. Si vous prenez plus de paramètres, vous pouvez également voir le reste du tableau.

function speak(line, line1, line2) { 
 
    console.log(line); 
 
    console.log(line1); 
 
    console.log(line2); 
 
} 
 

 
var whiteRabbit = { 
 
    type: "white", 
 
    speak: speak 
 
}; 
 

 
speak.apply(whiteRabbit, ["Burp!", "Skree", "Hello"]);

Si vous souhaitez utiliser les valeurs sous forme de tableau, vous utilisez yould arguments et itérer les valeurs.

function speak() { 
 
    Array.prototype.forEach.call(arguments, function (s) { 
 
     console.log(s); 
 
    }); 
 
} 
 

 
var whiteRabbit = { 
 
    type: "white", 
 
    speak: speak 
 
}; 
 

 
speak.apply(whiteRabbit, ["Burp!", "Skree", "Hello"]);

Wit ES6 vous pouvez utiliser rest parameters ...

function speak(...args) { 
 
    args.forEach(s => console.log(s)); 
 
} 
 

 
var whiteRabbit = { 
 
    type: "white", 
 
    speak: speak 
 
}; 
 

 
speak.apply(whiteRabbit, ["Burp!", "Skree", "Hello"]);

+0

Merci pour la réponse! Donc, rendez-le dynamique, je devrais utiliser arguments.length. Droite? –

+0

@rajeev ou encore meilleure syntaxe de repos/propagation: 'function speak (... args) {console.log (... args);}' –

0

Je vais supposer que fatRabbit est censé être whiteRabbit et que votre question est pourquoi vous ne voyez que Burp! au lieu du tableau complet.

La raison est que apply utilise le tableau pour appeler votre fonction avec arguments discrets, donc la première entrée apparaît comme le paramètre line, et vous ne voyez pas les autres parce que vous n'avez pas de paramètres pour les .

Si vous voulez voir le tableau, utilisez call plutôt que apply; puis line se reportera au tableau, et pas seulement la première entrée:

function speak(line) { 
 
    console.log(line); 
 
} 
 
var whiteRabbit = {type: "white", speak: speak}; 
 
speak.call(whiteRabbit, ["Burp!","Skree","Hello"]);

Alternativement, ajouter d'autres paramètres dans la méthode (speak(line1, line2, line3)).


Dans un commentaire, vous avez demandé:

Pouvez-vous montrer comment rendre dynamique?

Si par « dynamique » vous voulez dire qu'il enregistre autant d'entrées qu'il obtient, j'utiliser call (comme ci-dessus) et une boucle:

function speak(lines) { 
 
    lines.forEach(function(line) { 
 
     console.log(line); 
 
    }); 
 
} 
 
var whiteRabbit = {type: "white", speak: speak}; 
 
speak.call(whiteRabbit, ["Burp!","Skree","Hello"]);

C'est à l'aide forEach, mais you have lots of other options.

+0

Merci pour votre réponse! Pouvez-vous montrer comment le rendre dynamique? –

+0

@RajeevHanda: Qu'entendez-vous par "dynamique"? –

+0

@RajeevHanda: J'ai compris ce que vous entendez par dynamique ci-dessus. –

0

Vous devez ajouter plusieurs paramètres

function speak(line, line2, line3) { 
 
    console.log(line, line2, line3); 
 
} 
 
var whiteRabbit = {type: "white", speak: speak}; 
 
speak.apply(whiteRabbit, ["Burp!","Skree","Hello"]);

0

Vous pouvez laisser le lapin dire un mot après l'autre:

["Burp!","Skree","Hello"].forEach(speak); 

Si vous voulez changer aussi le contexte:

["Burp!","Skree","Hello"].forEach(word => speak.call(rabbit, word));