Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.

Ya que en el video no está del todo claro el por qué se usa function.bind(object), voy a intentar explicarlo de la forma más simple posible:

Antes que nada, hay que entender el concepto de this en JavaScript. Cuando utilizamos this, 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 this.altura o this.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 this, 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 this fuera de cualquier clase u objeto, siempre vamos a estar haciendo referencia al objeto global window . Básicamente, todo lo que escribimos en JavaScript está contenido dentro de window.

Ahora, sabiendo todo lo anterior, estamos listos para entender la utilidad de function.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 this 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 ladrar(), podemos suponer que este método accede a propiedades internas de "Perro" como pueden ser this.lengua o this.hocico. En un llamado normal a este método que se haga desde fuera de la clase, como es perro.ladrar(), sabemos que cualquier this que haya dentro del método hace referencia a perro. Bueno, la cosa cambia totalmente cuando asignamos this.ladrar() a una constante o variable externa a la clase. Si declaramos algo como const ladrarExterno = perro.ladrar y llamamos a ladrarExterno(), el this de ladrarExterno() va a pasar a ser el objeto del contexto actual, que normalmente es window, 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 ladrarExterno() estaría intentando acceder a this.lengua o this.hocico siendo que nuestro nuevo this (el objeto window) no contiene ninguna de esas propiedades.

Para solucionar un problema como el del ejemplo anterior es que utilizamos function.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 bind, no importa dónde o a qué constante o variable le asignemos esta nueva función, su this SIEMPRE apuntará al objeto que le hayamos pasado por parámetro.

Sabiendo todo esto, ¿Pór qué el profesor escribe this.vender = this.vender.bind(this) en el constructor de la clase "Cupcake"?

Lo que hace es crear una nueva propiedad en "Cupcake": this.vender, a la que le asigna una copia del método vender() en la cual su this siempre apuntará al this 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 bind(), puede asignar este nuevo this.vender al método onClick de button sin perder la referencia del this 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 bind().

Saludos.