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]


This content originally appeared on DEV Community and was authored by Cristobal Vega

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.


This content originally appeared on DEV Community and was authored by Cristobal Vega


Print Share Comment Cite Upload Translate Updates
APA

Cristobal Vega | Sciencx (2021-07-13T17:24:58+00:00) This en JavaScript. Retrieved from https://www.scien.cx/2021/07/13/this-en-javascript/

MLA
" » This en JavaScript." Cristobal Vega | Sciencx - Tuesday July 13, 2021, https://www.scien.cx/2021/07/13/this-en-javascript/
HARVARD
Cristobal Vega | Sciencx Tuesday July 13, 2021 » This en JavaScript., viewed ,<https://www.scien.cx/2021/07/13/this-en-javascript/>
VANCOUVER
Cristobal Vega | Sciencx - » This en JavaScript. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/07/13/this-en-javascript/
CHICAGO
" » This en JavaScript." Cristobal Vega | Sciencx - Accessed . https://www.scien.cx/2021/07/13/this-en-javascript/
IEEE
" » This en JavaScript." Cristobal Vega | Sciencx [Online]. Available: https://www.scien.cx/2021/07/13/this-en-javascript/. [Accessed: ]
rf:citation
» This en JavaScript | Cristobal Vega | Sciencx | https://www.scien.cx/2021/07/13/this-en-javascript/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.