Explicación de function.bind(object)
Ya que en el video no está del todo claro el por qué se usa
.bind(object)
, voy a intentar explicarlo de la forma más simple posible:
Antes que nada, hay que entender el concepto de
en JavaScript. Cuando utilizamos
, siempre hacemos referencia al objeto del contexto actual, ¿Y qué significa esto? Significa que estamos accediendo a una propiedad o método del objeto que envuelve al código en el que estamos parados actualmente.
Por ejemplo, si creo una clase "Perro", cada vez que escriba DENTRO de la clase algo como
.altura
o
.ladrar()
, estoy haciendo referencia a una propiedad (altura) o a un método (ladrar) que sólo existe dentro de "Perro". La forma más simple de entenderlo, es tomar la traducción literal de "this", que significa "esto" en español. Entonces, cuando esté programando y escriba
, simplemente pienso en el "esto" que envuelve al código que estoy escribiendo actualmente. Si miro unas líneas más arriba y veo que está todo dentro de la clase "Perro", entonces sé que "esto" (this) significa "Perro", por lo que cualquier propiedad o método que escriba allí pertenece exclusivamente a "Perro" (this).
Algo importante a tener en cuenta: cuando escribimos
fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global
. Básicamente, todo lo que escribimos en JavaScript está contenido dentro de
.
Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de
.bind(object)
.
En JavaScript, los métodos que declaramos dentro de una clase u objeto permanecen enlazados a esa clase u objeto siempre y cuando no se asignen a una constante o variable externa. ¿Qué quiero decir con esto? Que el
del método puede cambiar, y no necesariamente va a apuntar al mismo objeto en el que se declaró el método.
Siguiendo el ejemplo anterior, si dentro de la clase "Perro" está el método
()
, podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser
.lengua
o
.hocico
. En un llamado normal a este método que se haga desde fuera de la clase, como es
.ladrar()
, sabemos que cualquier
que haya dentro del método hace referencia a
. Bueno, la cosa cambia totalmente cuando asignamos
.ladrar()
a una constante o variable externa a la clase. Si declaramos algo como
ladrarExterno = perro.ladrar
y llamamos a
()
, el
de
()
va a pasar a ser el objeto del contexto actual, que normalmente es
, salvo que estemos dentro de una clase u objeto. En un caso como este, al ejecutar nuestro código recibiríamos un error, ya que
()
estaría intentando acceder a
.lengua
o
.hocico
siendo que nuestro nuevo
(el objeto
) no contiene ninguna de esas propiedades.
Para solucionar un problema como el del ejemplo anterior es que utilizamos
.bind(object)
. Lo que hace esto es devolvernos una copia exacta de la función, pero ahora es una función que realmente está enlazada al objeto que le pasemos por parámetro. Haciendo uso del
, no importa dónde o a qué constante o variable le asignemos esta nueva función, su
SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.
Sabiendo todo esto, ¿Pór qué el profesor escribe
.vender = this.vender.bind(this)
en el constructor de la clase "Cupcake"?
Lo que hace es crear una nueva propiedad en "Cupcake":
.vender
, a la que le asigna una copia del método
()
en la cual su
siempre apuntará al
que le envió por parámetro, que en este caso es "Cupcake" (aclaración: siempre apuntará al objeto instanciado a partir de "Cupcake", no a la clase "Cupcake" en sí). Una vez hecho esto, y gracias a la utilización del
()
, puede asignar este nuevo
.vender
al método
de
sin perder la referencia del
original.
La explicación resultó un poco extensa, pero espero que pueda entenderse con claridad. Para cerrar, voy a dejar una imagen del ejemplo de la clase "Perro" con código y resultados en consola, como para despejar cualquier duda posible sobre el uso y funcionamiento del método
()
.
Saludos.
