JavaScript esto | Explicado

Uno de los conceptos más desafiantes y comúnmente utilizados en JavaScript es el «Este» Palabra clave. JavaScript utiliza «Este” Palabra clave diferente que en otros idiomas. Sin embargo, es esencial para crear código JavaScript más avanzado. Como principiante, puede que le resulte un poco difícil entender cómo usar dicha palabra clave, ¡pero no se preocupe! Esta publicación explica el “Este” Palabra clave y su uso en JavaScript.

¿Qué es «esto» en JavaScript?

«Este“ es la palabra clave en JavaScript que se refiere a un objeto que ejecuta el bloque de código dado. Representa un objeto que llama a la función actual. Se utiliza de diferentes maneras en varios escenarios, p. p.ej.:

• • en método
  • En el manejo de eventos
  • Para funciones

¡Veamos cada uno de los usos mencionados uno por uno!

¿Cómo uso «esto» en los métodos de JavaScript?

«Este‘ se usa en los métodos de JavaScript como un enlace implícito. Si la función se llama usando un objeto y un punto, esto se considera un enlace implícito y «Este‘ indica el objeto durante la llamada a la función.
ejemplo
Primero creamos un objeto con algunas propiedades y un método y luego usamos el «Este” palabra clave para obtener los valores de las propiedades del objeto: var personInfo = { nombre: «Juan», edad: 20, información: función () { consola.log («¡Hola! Soy » + este.nombre + » y Tengo » + this.age + » years old»); }} A continuación, llame al «la información()” junto con el nombre del objeto: se puede ver que los valores de propiedad especificados del objeto actual se muestran correctamente:

Si usted «Este” Para el manejo de eventos, siga la sección a continuación.

¿Cómo usar «esto» en el manejo de eventos de JavaScript?

En este ejemplo, vea el uso de «Este” palabra clave en el manejo de eventos. Para hacer esto, considere un ejemplo donde ocultamos nuestro botón con un solo clic. Para hacer esto, cree un botón y agregue un «al hacer clic()» evento para acceder a la propiedad style.display con el «Este” palabra clave que oculta el botón cuando se hace clic:

Haga clic para ocultar el botón

¡Haga clic aquí!
producción

Si le preocupa el uso de «Este” Palabra clave en funciones definidas por el usuario en JavaScript, siga la sección dada.

¿Cómo uso «esto» en las funciones de JavaScript?

durante el uso»Este” en funciones, hay tres tipos de enlaces en JavaScript, que incluyen:

• • enlace predeterminado
  • Enlace implícito
  • Enlace explícito

¡Vamos a entenderlos uno por uno!
Ejemplo 1: usar esta palabra clave en el enlace predeterminado
Para el enlace predeterminado, esto es «EsteLa palabra clave actúa como un objeto global. Se utiliza principalmente en funciones independientes. Entendamos el concepto dado con un ejemplo. Primero creamos una variable «X‘ y le asigna el valor ‘quince«: Luego defina una función llamada «FunciónDB()” y su definición de función, crea una variable con el mismo nombre “X” y asignarle un valor “5‘, luego imprima su valor con el ‘consola.log()” Método con “Este” Palabra clave: var functionDB = function() { var x = 5; console.log(this.x);} Por último, llame al «FunciónDB()Función ”: Debido al uso de la función “Este” palabra clave, la salida muestra el valor de “X» cómo «quince” porque actúa como un objeto global y el proceso se llama “Enlace dinámico“:

Ejemplo 2: uso de esta palabra clave en el enlace implícito
Si la función se llama desde un objeto o un símbolo de punto, «EsteLa palabra clave ” actúa como un enlace implícito. Apunta al objeto durante la llamada a la función. En este ejemplo definimos una función «la información()‘ y usa el ‘Este” Palabra clave en la definición de la función: function info(){ console.log(«¡Hola! Soy » + this.name + » and I am » + this.age + » years old»)} Luego crea un objeto con el nombre «información de la persona” con propiedades definidas: var personInfo = { nombre: «Juan», edad: 20, información: información} Ahora llame a la función junto con el objeto:

producción

Ejemplo 3: uso de esta palabra clave en el enlace explícito
La vinculación explícita también se denomina «enlace duro” porque la función se llama a la fuerza para invocar un objeto específico para “Este” vinculante sin establecer una referencia de función de propiedad al objeto. Para ello se pueden utilizar los métodos call(), apply() y bind(). Ahora usaremos la misma función llamada «la información()‘ definido en el ejemplo anterior. Luego crea un objeto llamado «información de la persona” con los siguientes valores: var personInfo = { nombre: «Juan», edad: 20} Para llamar a la función denominada «la información()‘, usamos el ‘Llamada telefónica()‘ y pasar el objeto creado como un argumento: dado que info() no es parte del objeto, aún accedimos a él explícitamente:

También puede usar los métodos apply() y bind() para llamar explícitamente a una función. El método apply() es idéntico al método call(), mientras que el método bind() crea una nueva función con el mismo cuerpo y alcance que se comporta igual que la función original. El método bind() se puede usar para devolver una función que puede usar más adelante. Para llamar a info() con el método apply(), utilice la siguiente instrucción, que devuelve el mismo resultado que el método call():

por la llamada»la información()» con el «Corbata()El método ” usa la declaración dada:

producción

Tenemos toda la información esencial sobre el tema «Este» señal.

Conclusión

«Este“ es la palabra clave en JavaScript que se refiere a un objeto que ejecuta el bloque de código dado. Representa el objeto que llama a la función actual. Se usa en múltiples escenarios de diferentes maneras, incluidos métodos, manejo de eventos y funciones. En este post tenemos el “Este” palabra clave en JavaScript.