Uno de los conceptos más desafiantes y de uso frecuente en JavaScript es el ' este ” palabra clave. JavaScript utiliza el ' este ” palabra clave de manera diferente a otros idiomas. Sin embargo, es esencial para crear código JavaScript más avanzado. Como principiante, podría resultarle difícil comprender el uso de la palabra clave mencionada, ¡pero no se preocupe!
Esta publicación explicará 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 existente. Representa un objeto que está invocando la función actual. Se utiliza en múltiples escenarios de diferentes maneras, tales como:
-
- en método
- En el manejo de eventos
- en funciones
¡Veamos cada uno de los usos mencionados uno por uno!
¿Cómo usar 'esto' en los métodos de JavaScript?
“ este ” se utiliza en los métodos de JavaScript como un enlace implícito. Cuando se llama a la función con la ayuda de un objeto y un punto, se considera un enlace implícito, y “ este ” señala el objeto durante la llamada a la función.
Ejemplo
Primero, crearemos un objeto con algunas propiedades y un método y luego usaremos el “ este ” palabra clave para obtener los valores de las propiedades del objeto:
var infopersona = {
nombre: 'John' ,
años : 20 ,
información: función ( ) {
consola.log ( '¡Hola! Soy' + this.name + ' y yo soy ' + esta edad + 'años' ) ;
}
}
A continuación, llame al “ información() ” método junto con el nombre del objeto:
Se puede ver que los valores de propiedad especificados del objeto actual se muestran con éxito:
Si desea utilizar “ este ” en 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, compruebe el uso de ' este ” palabra clave en el manejo de eventos. Para esto, considere un ejemplo en el que ocultaremos nuestro botón con un solo clic. Para hacerlo, cree un botón y adjunte un ' al hacer clic() ” con él para acceder a la propiedad style.display con el “ este ” palabra clave que ocultará el botón cuando se haga clic:
< h3 > Haga clic para ocultar el botón h3 >< botón al hacer clic = 'este.estilo.display='ninguno'' > Haga clic aquí ! botón >
Producción
Si está confundido acerca del uso de “ este ” palabra clave en funciones definidas por el usuario en JavaScript, siga la sección dada.
¿Cómo usar '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 individualmente!
Ejemplo 1: uso de esta palabra clave en el enlace predeterminado
En el enlace predeterminado, el ' este La palabra clave ” actúa como un objeto global. Se utiliza principalmente en funciones independientes.
Entendamos el concepto enunciado con un ejemplo.
Primero, crearemos una variable “ X ” y asígnele el valor “ 15 ”:
var x = 15 ;
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 usando el “ consola.log() ” método con “ este palabra clave:
var x = 5 ;
consola.log ( esta X ) ;
}
Por último, llame al “ funciónDB() ' función:
Debido al uso de la “ este ” palabra clave, la salida muestra el valor de “ X ' como ' 15 ” porque actúa como un objeto global y el proceso se llama “ Enlace dinámico ”:
Ejemplo 2: uso de esta palabra clave en enlace implícito
Cuando la función es llamada por un objeto o un símbolo de punto, “ este La palabra clave ” actúa como un enlace implícito. Señala el objeto durante la llamada a la función.
En este ejemplo, definiremos una función “ información() ” y usa el “ este ” palabra clave en la definición de la función:
función información ( ) {consola.log ( '¡Hola! Soy' + this.name + ' y yo soy ' + esta edad + 'años' )
}
Luego, crea un objeto llamado “ personaInfo ” con propiedades definidas:
nombre: 'John' ,
años : 20 ,
información: información
}
Ahora, llame a la función a lo largo del objeto:
Producción
Ejemplo 3: uso de esta palabra clave en enlace explícito
La vinculación explícita también se denomina “ encuadernación dura ' porque la función se llama a la fuerza para utilizar un objeto particular para ' este ” vinculante, sin poner una referencia de función de propiedad en el objeto. Para ello, se pueden utilizar los métodos call(), apply() y bind().
Ahora utilizaremos la misma función llamada ' información() ” definido en el ejemplo anterior. Luego, crea un objeto llamado “ personaInfo ” con los siguientes valores:
var infopersona = {nombre: 'John' ,
años : 20
}
Para invocar la función denominada “ información() ”, usaremos el “ llamar() ” y pase el objeto creado como argumento:
Como info() no es parte del objeto, todavía hemos accedido explícitamente a él:
Para llamar a una función explícitamente, también puede usar los métodos apply() y bind(). 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 de la misma manera que la función original. El método bind() se puede utilizar para devolver una función que puede usar más adelante.
Para llamar a info() con el método apply(), use la siguiente declaración:
info.aplicar ( personaInfo ) ;
Da el mismo resultado que el método call() da:
Para llamar ' información() ' con el ' unir() ” método, utilice la declaración dada:
Producción
Hemos recopilado toda la información esencial relacionada con el “ este ” palabra clave.
Conclusión
“ este ” es la palabra clave en JavaScript que se refiere a un objeto que ejecuta el bloque de código existente. Representa el objeto que está invocando la función actual. Se usa en múltiples escenarios de diferentes maneras, incluidos métodos, manejo de eventos y funciones. En este post, hemos explicado el “ este ” palabra clave en JavaScript.