El tutorial de hoy es cortesía del talentoso Cody Lindley, de su libro electrónico gratuito: Enlightenment JavaScript. Discute lo confuso esta
palabra clave, y las diversas formas de determinar y establecer su valor.
Cada pocas semanas, revisamos algunas de las publicaciones favoritas de nuestros lectores de toda la historia del sitio. Este tutorial se publicó por primera vez en julio de 2011..
esta
Cuando se crea una función, se crea una palabra clave llamada esto (detrás de la escena), que enlaza con el objeto en el que opera la función. Dicho de otra manera, esto está disponible para el alcance de su función, pero es una referencia al objeto del cual esa función es una propiedad / método..
Echemos un vistazo a este objeto:
Note cómo dentro de la getGender
función, estamos accediendo a la propiedad de género usando notación de puntos (por ejemplo, cody.gender
) en el propio objeto cody. Esto puede ser reescrito usando esta
para acceder a la cody
objeto porque esta
apunta a la cody
objeto.
los esta
utilizado en esto.
simplemente se refiere a la cody
Objeto sobre el que se encuentra la función.
operando.
El tema de esta
Puede ser confuso, pero no tiene por qué serlo. Solo recuerda que, en general, esta
se usa dentro de las funciones para referirse al objeto dentro del cual está contenida la función, a diferencia de la función en sí misma (las excepciones incluyen el uso de nuevo
palabra clave o llamada()
y aplicar()
).
esta
se ve y actúa como cualquier otra variable, excepto que no puedes modificarla. argumentos
y cualquier parámetro enviado a la función., esta
es una palabra clave (no una propiedad) en el objeto de llamada / activación. esta
Determinado? El valor de esta
, Pasado a todas las funciones, se basa en el contexto en el que se llama a la función en tiempo de ejecución. Preste atención aquí, porque esta es una de esas peculiaridades que solo necesita memorizar.
los miObjeto
objeto en el código de abajo se le da una propiedad llamada decirFoo
, que apunta a la decirFoo
función. Cuando el decirFoo
La función se llama desde el ámbito global, esto se refiere al objeto de ventana. Cuando se le llama como método de miObjeto
, esta
se refiere a miObjeto
.
Desde que miObjeto
tiene una propiedad llamada foo
, esa propiedad es usada.
Claramente, el valor de esta
se basa en el contexto en el que se llama la función. Considera que ambos myObject.sayFoo
y decirFoo
apuntar a la misma función. Sin embargo, dependiendo de dónde (es decir, el contexto) sayFoo ()
se llama desde, el valor de esta
es diferente.
Si ayuda, aquí está el mismo código con el objeto head (es decir, ventana
) utilizado explícitamente.
Asegúrese de que al pasar por las funciones, o tener múltiples referencias a una función, se dé cuenta de que el valor de esta
cambiará dependiendo del contexto en el que llame a la función.
esta
y los argumentos siguen el alcance léxico. esta
La palabra clave se refiere al objeto principal en funciones anidadas Quizás te preguntes qué pasa con esta
cuando se usa dentro de una función que está contenida dentro de otra función. La mala noticia está en ECMA 3., esta
pierde su camino y se refiere al objeto cabeza (ventana
objeto en los navegadores), en lugar del objeto dentro del cual se define la función.

En el código de abajo, esta
dentro de func2
y func3
pierde su camino y no se refiere a miObjeto
pero en cambio al objeto cabeza.
La buena noticia es que esto se solucionará en ECMAScript 5. Por ahora, debe tener en cuenta este problema, especialmente cuando comienza a pasar funciones como valores a otras funciones..
Considere el siguiente código y lo que sucede cuando pasa una función anónima a foo.func1. Cuando la función anónima se llama dentro de foo.func1
(una función dentro de una función) la esta
El valor dentro de la función anónima será una referencia al objeto principal..
Ahora nunca olvidarás: el esta
el valor siempre será una referencia al objeto principal cuando su función de host se encapsula dentro de otra función o se invoca dentro del contexto de otra función (de nuevo, esto se corrige en ECMAScript 5).
De manera que la esta
El valor no se pierde, simplemente puede usar la cadena de alcance para mantener una referencia a esta
en la función padre. El siguiente código muestra cómo, usando una variable llamada ese
, y aprovechando su alcance, podemos hacer un mejor seguimiento del contexto de la función.

esta
El valor de esta
normalmente se determina a partir del contexto en el que se llama una función (excepto cuando el nuevo
se usa la palabra clave (más sobre eso en un minuto), pero puede sobrescribir / controlar el valor de esta
utilizando aplicar()
o llamada()
para definir que objeto esta
Apunta al invocar una función. Usar estos métodos es como decir: "Oye, llama a la función X pero dile a la función que use el objeto Z como el valor para esta
."Al hacerlo, la forma predeterminada en la que JavaScript determina el valor de esta
está anulado.
A continuación, creamos un objeto y una función. Entonces invocamos la función a través de llamada()
para que el valor de esta
Dentro de la función usa. miObjeto
como su contexto. Las declaraciones dentro del mi función
la función se rellenará miObjeto
con propiedades en lugar de poblar el objeto cabeza. Hemos alterado el objeto al cual esta
(dentro de mi función
) se refiere.
En el ejemplo anterior, estamos usando llamada()
, pero aplicar()
podría ser utilizado también. La diferencia entre los dos es cómo se pasan los parámetros para la función. Utilizando llamada()
, Los parámetros son solo valores separados por comas. Utilizando aplicar()
, los valores de los parámetros se pasan dentro de una formación
. A continuación, es la misma idea, pero usando aplicar()
.
Lo que debe quitar aquí es que puede anular la forma predeterminada en que JavaScript determina el valor de
esta
en el alcance de una función.
esta
Palabra clave dentro de una función constructora definida por el usuario Cuando se invoca una función con el nuevo
palabra clave, el valor de esta
- como se indica en el constructor, se refiere a la instancia en sí. Dicho de otra manera: en la función de constructor, podemos aprovechar el objeto a través de esta
antes de que el objeto sea realmente creado. En este caso, el valor por defecto de esta
Cambia de una manera no muy diferente al uso llamada()
o aplicar()
.
A continuación, configuramos un Persona
función constructora que utiliza esta
para hacer referencia a un objeto que se está creando. Cuando una instancia de Persona
es creado, este nombre
hará referencia al objeto recién creado y colocará una propiedad llamada nombre
en el nuevo objeto con un valor del parámetro (nombre
) Pasado a la función constructora..
Otra vez, esta
se refiere al "objeto que será" cuando se invoca la función de constructor usando el nuevo
palabra clave. Si no hubiéramos usado el nuevo
palabra clave, el valor de esta
sería el contexto en el que se invoca a Person, en este caso, el objeto head. Examinemos este escenario.
esta
Dentro de un método de prototipo se refiere a una instancia de Constructor Cuando se usa en funciones agregadas a un constructor prototipo
propiedad, esta
se refiere a la instancia en la que se invoca el método. Digamos que tenemos una costumbre Persona()
Función constructora. Como parámetro, requiere el nombre completo de la persona. En caso de que necesitemos acceder al nombre completo de la persona, agregamos un whatIsMyFullName
método para el Person.prototype
, para que todo Persona
Las instancias heredan el método. Cuando usas esta
, el método puede referirse a la instancia que lo invoca (y por lo tanto a sus propiedades).
Aquí os muestro la creación de dos. Persona
objetos (cody
y lisa
) y el heredado whatIsMyFullName
Método que contiene la palabra clave this para acceder a la instancia..
La quita aquí es que la palabra clave esta
se utiliza para referirse a casos cuando se utiliza dentro de un método contenido en el prototipo
objeto. Si la instancia no contiene la propiedad, comienza la búsqueda del prototipo.
- Si la instancia o el objeto señalado por esta
no contiene la propiedad a la que se hace referencia, se aplican las mismas reglas que se aplican a cualquier búsqueda de propiedad y la propiedad se "buscará" en la cadena de prototipos. Así que en nuestro ejemplo, si el nombre completo
propiedad no estaba contenida dentro de nuestra instancia, entonces nombre completo
sería buscado en Person.prototype.fullName
entonces Object.prototype.fullName
.
Este libro no trata sobre los patrones de diseño de JavaScript o la implementación de un paradigma orientado a objetos con código JavaScript. No fue escrito para distinguir las buenas características del lenguaje JavaScript de las malas. No pretende ser una guía de referencia completa. No está dirigido a personas nuevas en programación o aquellas completamente nuevas a JavaScript. Tampoco es este un libro de cocina de recetas de JavaScript. Esos libros han sido escritos..