Métodos de objeto, «this»
Los objetos comúnmente representan entidades del mundo real, como usuarios, órdenes, etc. Por ejemplo, creamos un objeto user
:
let user = {
name: "John",
age: 30
};
En el contexto real, un usuario puede realizar acciones como seleccionar elementos del carrito de compras, hacer login, logout, etc. Estas acciones se implementan asignando funciones a las propiedades del objeto.
Ejemplos de métodos
Para comenzar, vamos a enseñarle al usuario user
a saludar:
let user = {
name: "John",
age: 30
};
user.sayHello = function() {
alert("¡Hola!");
};
user.sayHello(); // ¡Hola!
Aquí usamos una expresión de función para crear la función sayHello
y la asignamos a la propiedad user.sayHello
del objeto. Luego la llamamos con user.sayHello()
. ¡Ahora el usuario puede saludar!
Cuando una función es propiedad de un objeto, se la llama método de ese objeto.
También podríamos usar una función declarada previamente como método, de esta manera:
let user = {
// ...
};
function sayHello() {
alert("¡Hola!");
};
user.sayHello = sayHello;
user.sayHello(); // ¡Hola!
Programación orientada a objetos
Cuando organizamos nuestro código utilizando objetos que representan entidades, esto se conoce como Programación Orientada a Objetos (POO).
POO es un campo extenso y fascinante en sí mismo. Implica elegir las entidades adecuadas y organizar la interacción entre ellas. Hay excelentes libros sobre el tema como «Patrones de diseño: Elementos de software orientado a objetos reutilizable» de E. Gamma, R. Helm, R. Johnson, J. Vissides y «Análisis y Diseño Orientado a Objetos» de G. Booch, entre otros.
Formas abreviadas para los métodos
Existe una sintaxis más concisa para definir métodos en objetos literales:
let user = {
sayHello: function() {
alert("Hola");
}
};
// La forma abreviada se ve más limpia, ¿verdad?
user = {
sayHello() { // Equivalente a "sayHello: function(){...}"
alert("Hola");
}
};
“this” en métodos
Es común que un método de objeto necesite acceder a la información almacenada en el propio objeto para realizar su tarea. Para esto, se utiliza la palabra clave this
.
El valor de this
es el objeto «antes del punto», es decir, el objeto usado para llamar al método. Por ejemplo:
let user = {
name: "John",
age: 30,
sayHello() {
// "this" se refiere al "objeto actual"
alert(this.name);
}
};
user.sayHello(); // John
Aquí, durante la ejecución de user.sayHello()
, el valor de this
será user
.
“this” no está vinculado
En JavaScript, la palabra clave this
se comporta de manera diferente a la mayoría de los otros lenguajes de programación. Puede ser utilizado en cualquier función, incluso si no es un método de un objeto.
Por ejemplo, en el siguiente código:
function sayHello() {
alert( this.name );
}
El valor de this
se evalúa en tiempo de ejecución, dependiendo del contexto.
Llamado sin un objeto: this == undefined
Es posible llamar a una función sin un objeto asociado:
function sayHello() {
alert(this);
}
sayHello(); // undefined
En este caso, en modo estricto ("use strict"
), this
es undefined
. En modo no estricto, this
apunta al objeto global (window
en un navegador).
Funciones de flecha no tienen “this”
Las funciones de flecha en JavaScript son especiales: no tienen su propio this
. Si se hace referencia a this
dentro de una función de flecha, su valor se toma del contexto externo. Por ejemplo:
let user = {
firstName: "Ilya",
sayHello() {
let arrow = () => alert(this.firstName);
arrow();
}
};
user.sayHello(); // Ilya
Esto es una característica útil cuando queremos que this
se refiera al contexto externo en lugar de al objeto que llama al método.
Resumen
- Los métodos son funciones que están almacenadas como propiedades de un objeto.
- Los métodos permiten que los objetos «actúen», como
object.doSomething()
. - Los métodos pueden hacer referencia al objeto usando la palabra clave
this
. - El valor de
this
se determina en tiempo de ejecución.