42.5 call e apply

Vediamo 2 metodi che vanno a mettere a disposizione le proprietà di un oggetto. Tale metodo rende disponibili le proprietà ad una funzione, il call richiama un valore, l’apply lavora sugli array.

Creiamo una funzione corsa con 1 parametro che verrà scritto sul console.log del mio browser

let corsa = function (km) {
    console.log(km);
}

creiamo un oggetto che non ha nessun collegamento con la funzione appena creata

let corsaTappe = { primaTapppa: 'dopo 10 km' , secondaTappa: 'dopo 20 km', terza: "30" };

L’intenzione è quella di condividere le proprietà dell’oggetto corsaTappe con la funzione corsa().

Richiamo quindi la funzione corsa usando il metodo call che avrà come parametro l’oggetto corsaTappe

corsa.call(corsaTappe);

In questo modo abbiamo passato le proprietà dell’oggetto alla funzione, ma la funzione restituirà undefined, perchè non sa quale valore di quale proprietà dovrà stampare, quindi facciamo una prova richiamandone una nella funzione

corsa = function (km) {
    console.log(km);
    console.log(this.secondaTappa);
}

avremo 2 output in console, il primo undefined e il secondo dopo 20 km. Aggiungiamo alla funzione call una proprietà specifica dell’oggetto

corsa.call(corsaTappe, corsaTappe.primaTappa);

apply

vediamo lo stesso esempio passando l’oggetto corsaTappe tramite il metodo apply() alla funzione corsa, facendo attenzione che il parametro passato sarà un’array quindi passato tra quadre

corsa.apply(corsaTappe, ['dopo 40 km']);

e il console.log stamperà dopo 40km e dopo 20km (this.secondaTappa).

Assegnamo l’apply ad una variabile

var opzioni = corsa.apply(corsaTappe, ['dopo 40 km']);
document.write(opzioni);

riceverò undefined, perchè devo far restituire il valore col return

corsa = function (km) {
    //console.log(km);
    return (km);
    console.log(this.secondaTappa);
}

andiamo a formattare il testo stampato utilizzando l’ escape per ricevere il corretto output e segnalare all’interprete che siamo in presenza di una stringa

document.write('l\'ultima tappe è' + ' ' + opzioni);