wie funktioniert Function.apply in Javascript

Question

Ich versuche, aus nur Function.apply() in Javascript, ich habe Probleme zu verstehen, wie es die Array-Parameter analysiert, in der wir übergeben. Zum Beispiel

var update = function(name, profession){ 
    this.name = name; 
    this.profession = profession; 
} 

var p1 = { 
    name : "bond", 
    profession : "actor" 
} 

console.log(p1.name, p1.profession); //outputs bond actor 

jetzt können Eigenschaften gelten() -Methode

update.apply(p1, ["john", "developer"]; 

mit der Änderung p1 erste Argument ist, Wert für this Zeiger und zweite Argument ist ein array

console.log(p1.name, p1.profession); //outputs john developer 

Die Funktion update() nimmt zwei Parameter Namen und Beruf, aber ich bin nur in einem array Parameter ["john", "developer"], um es durch apply() Methode übergeben. Ich verstehe nicht, wie meine update() Methode die Eigenschaften aus dem übergebenen Array korrekt erfasst und jede Eigenschaft entsprechend aktualisiert. Danke

Answer 1

apply funktioniert, indem Sie das Array ausbreiten und jedes Element dieses Arrays als einen anderen Parameter übergeben. Dies alles wird durch die Reihenfolge bestimmt, in der sie im Array erscheinen.

Beispiel:

function printThings(pre, a, b, c) { 
 
    var el = document.querySelector('pre'); // Put the text into an element 
 
    el.innerHTML += pre + '> 1: ' + a + '\n'; 
 
    el.innerHTML += pre + '> 2: ' + b + '\n'; 
 
    el.innerHTML += pre + '> 3: ' + c + '\n\n'; 
 
} 
 

 
// Calling it normally 
 
printThings('Normal', 'A', 'B', 'C'); 
 

 
// Call using apply 
 
// Notice how the array is in the same order as when we called it normally 
 
printThings.apply(null, ['Apply (1)', 'A', 'B', 'C']); 
 

 
// Now we'll rearrange the arguments 
 
printThings.apply(null, ['Apply (2)', 'C', 'A', 'B']);

<pre></pre>

Es lohnt sich auch das erste Argument apply weitergegeben zu erwähnen. In den vorherigen Beispielen habe ich null übergeben, da ich this innerhalb der Funktion überhaupt nicht verwende. Aber was wenn ich wäre? Dann kann ich this auf den Wert setzen, der als erstes Argument übergeben wurde.

function printThings(pre) { 
 
    var el = document.querySelector('pre'); 
 
    // Here, we expect "this" to be an object with a, b, and c properties 
 
    el.innerHTML += pre + '> A: ' + this.a + '\n'; 
 
    el.innerHTML += pre + '> B: ' + this.b + '\n'; 
 
    el.innerHTML += pre + '> C: ' + this.c + '\n\n'; 
 
} 
 

 
// Passing in null defaults to using the global context 
 
printThings.apply(null, ['Global']); 
 

 
// Notice how they're all undefined since there are no a, b, or c properties on the global scope 
 

 
// But now we'll pass it an object with some values 
 
printThings.apply({ 
 
    a: 'A', 
 
    b: 'B', 
 
    c: 'C' 
 
}, ['Matching Values']); 
 

 
// And just to drill the point home, here's an object with the right properties but different values 
 
printThings.apply({ 
 
    a: 'Here', 
 
    b: 'We', 
 
    c: 'Go' 
 
}, ['Different']);

<pre></pre>

Die genauen winzigsten Details von wie funktioniert es hängt von der JS-Engine sind Sie es in Laufen.