Function.prototype.call()

Il metodo call() esegue una funzione con un dato valore this e argomenti passati singolarmente.

func.call([thisArg[, arg1, arg2, ...argN]])

thisArg Optional

Il valore da usare come this quando si esegue func.

Attenzione: In certi casi, thisArg potrebbe non essere il valore reale visto dal metodo.

Se il metodo è una funzione in non-strict mode, null e undefined sarà sostituito dall'oggetto globale e i valori di tipo primitiva verranno convertiti in oggetti.

arg1, arg2, ...argN Optional

Argomenti per la funzione.

Il risultato dell'esecuzione della funzione con il this e gli argomenti specificati.

Il metodo call() consente a una funzione/metodo appartenente a un oggetto di essere essere assegnata e chiamata per un oggetto diverso..

call() fornisce un nuova valore di this alla funzione/metodo. Con call(), si può scrivere un metodo una volta ed ereditarlo in un altro oggetto senza dover riscrivere il metodo per il nuovo oggetto.

Si può usare call per collegare costruttori per un oggetto (simile a Java).

Nell'esempio seguente, il costruttore per l'oggetto Product è definito con 2 parametri: name e price.

Due altre funzioni, Food e Toy, invocano Product, passando this, name, e price. Product inizializza le proprietà name e price. Entrambe le funzioni specializzate definiscono la category.

function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = 'toy';
}

const cheese = new Food('feta', 5);
const fun = new Toy('robot', 40);

In questo esempio, viene create una funzione anonima e usato call per invocarla su ogni oggetto di un array.

Lo scopo principale della funzione anonima qui è di aggiungere una funzione print o ogni oggetto il quale è in grado di stampare il corretto indice dell'oggetto nell'array.

const animals = [
  { species: 'Lion', name: 'King' },
  { species: 'Whale', name: 'Fail' }
];

for (let i = 0; i < animals.length; i++) {
  (function(i) {
    this.print = function() {
      console.log('#' + i + ' ' + this.species
                  + ': ' + this.name);
    }
    this.print();
  }).call(animals[i], i);
}

Nell'esempio sotto, quando viene eseguita greet, il valore di this verrà legato all'oggetto obj.

function greet() {
  const reply = [this.animal, 'typically sleep between', this.sleepDuration].join(' ');
  console.log(reply);
}

const obj = {
  animal: 'cats', sleepDuration: '12 and 16 hours'
};

greet.call(obj);  // cats typically sleep between 12 and 16 hours

Nell'esempio sotto, viene invocata la funzione display senza passare il primo parametro. Se il primo parametro non è passato il valore di this è legato all'oggetto globale.

var sData = 'Wisen';

function display() {
  console.log('sData value is %s ', this.sData);
}

display.call();  // sData value is Wisen

'use strict';

var sData = 'Wisen';

function display() {
  console.log('sData value is %s ', this.sData);
}

display.call(); // Cannot read the property of 'sData' of undefined

• Function.prototype.bind()
• Function.prototype.apply()

• Introduction to Object-Oriented JavaScript