¡Hola!, muchas gracias por darte el tiempo de leer este artículo, en él hablaremos sobre this en Javascript.
This
En Javascript siempre va a representar algo diferente dependiendo del contexto en el que se encuentre, ya sea en una función, objecto o clase.
// this en el scope global
console.log(`this: ${this}`);
// Print: this: [object Window]
nos dirá que this es un objeto Window. Siempre que usemos this de forma global el browser lo va a asignar a Window.
This en el Scope de una función
function whoIsThis() {
return this
}
console.log(`whoIsThis: ${whoIsThis()}`);
// Print: whoIsThis: [object Window]
Al llamar la función directamente JavaScript le asigna Window.
El motor de JavaScript le asigna este valor por defecto, excepto si estamos usando JavaScript en el modo 'use strict'.
This en el scope de una función en strict mode
function whoIsThisStrict() {
'use strict'
return this
}
console.log(`whoIsThisStrict: ${whoIsThis()}`)
// Print: whoIsThisStrict: undefined
Strict mode nos sirve para evitar algunos errores
Errores que el puede pasar a cualquier programador.
This en el contexto de un objecto
Se refiere a un objeto. Ese objeto es el que actualmente está ejecutando un pedazo de código.
Básicamente, this está dentro de una función pero dicha función pertenece a un objeto, su valor cambia. En ese caso this se refiere al objecto.
// this en el contexto de un objeto
const person = {
name: 'Gabriel',
saludar: function() {
console.log(`Hola soy ${this.name}`);
},
};
person.saludar();
// Print: Hola soy Gabriel
This cuando sacamos la función saludar del objeto
// this cuando sacamos a una función de un objecto
const person = {
name: 'Gabriel',
saludar: function() {
console.log(`Hola soy ${this.name}`);
},
};
// Pasamos la función como referencia
const accion = person.saludar;
accion();
// Print: Hola soy
Esta función accion()
, no se está llamando dentro del contexto de un objecto.
Es como ejecutar una función directamente.
This en este caso sería Window
This en el contexto de una "clase"
Las clase como tal no existen de la misma manera en Javascript como en otros lenguajes de programación.
// this en el contexto de una "clase"
function Person(name) {
this.name = name;
}
Person.prototype.saludar = function() {
console.log(`Me llamo ${this.name}`);
}
const angela = new Person('Angela');
angela.saludar();
// Me llamo Angela
This, se refiere al objeto instanciado "Angela".
Entonces en `this.name=name` lo hacemos sobre la instancia Luis no sobre el objeto prototipo.
Top comments (0)