Utilizzare una funzione come un metodo consente di far puntare il riferimento this all’oggetto a cui il metodo appartiene e non causare “strani” comportamenti
In JavaScript per metodo si intende una funzione contenuta in una proprietà di un oggetto. Ad esempio sayHello è un metodo di myObject:
sayHello: function() {
return 'Hello';
}
};
console.log(myObject.sayHello());
Per poter accedere ai metodi di un oggeto si utilizza il “property accessor“, ovvero tramite la “dot notaion” (myObject.sayHello) o “bracket notation” (myObject[“sayHello”]).
Si parla di method invocation quando un’espressione forma un property accessor che valuta una funzione di un oggetto ed è seguita dalle parentesi tonde con eventualmente dei parametri passati al loro interno. Di conseguenza myObject.sayHello() e myObject[“sayHello”]() sono corrette invocazioni del metodo sayHello dell’oggetto myObject.
La principale differenza con le function invocation è che nella method invocation si richiede un property accessor per accedere alla funzione di un oggetto (obj.myFunc() oppure obj[“myFunc”]()), mentre nelle invocazioni di funzione è che si accede direttamente alla funzione (myFunc()). Capire la differenza tra i due tipi di invocazione consente di identificare correttamente il contesto in cui ci si trova (this).
Ad esempio quando myMethod viene invocato, il valore che this assumerà sarà myObject:
myMethod: function() {
console.log(this === myObject); // => true
}
};
myObject.myMethod();
Dato che this corrisponde all’oggetto, possiamo accendere alle proprietà dell’oggetto in cui ci troviamo:
name: "Datrevo",
sayTitleSite: function() {
console.log(this === mySite); // => true
return this.name;
}
};
mySite.sayTitleSite(); // => Datrevo
Nel metodo sayTitleSite() si è stati in grado di accedere, tramite this, al name dell’oggetto mySite in quanto puntata all’oggetto mySite.
Nella definizione di un costruttore, ad esempio:
this.surame = surname;
this.getSurname = function () {
console.log(this === Person); // => false
console.log(this.surname); // => undefined
}
}
var myPerson = new Person("Datrevo");
setTimeout(myPerson.getSurname, 1000);
La chiamata, dopo un secondo con setTimeout(), al metodo myPerson.getSurname è separata dall’oggetto quando viene passata come parametro e di conseguenza this punta all’oggetto globale (window, o undefined nella strict mode). Invocando il metodo con setTimeout(myPerson.getSurname(), 1000); il riferimento this punterà a Person.
Indice:
