JavaScript funciones: .call() .apply() .bind() simplificadas.

JavaScript funciones: .call() .apply() .bind() simplificadas.

Estos tres métodos forman parte de los prototipos de Function.prototypes. Básicamente, lo que hacen es cambiar la referencia de this (este) para que apunte al "objeto objetivo".


En este ejemplo, los 3 métodos hacen referencia al objeto person, por lo que this.name es ahora person.name. Y observa que la referencia al objeto se pasa como primer argumento.


índice de contenido

1- .call()


2- .apply()


3- .bind()


4- Ejemplo de bonificación


.call()

Toma 1 o más argumentos. El segundo argumento en adelante será pasado a la función.


p.d: podemos usar arguments en lugar de item1, item2:


.apply()

Toma 1 o 2 argumentos. El segundo argumento debe ser un array.


.bind()

Toma sólo un argumento. A diferencia de los métodos anteriores, este método no llama a la función de una vez. En su lugar, devuelve una nueva función, por lo que tendrá que llamarla posteriormente de forma manual.


Ejemplo de bonificación

Digamos que queremos añadir un escuchador de eventos a todo el <button> de un documento. Podemos utilizar .querySelectorAll() que devuelve un NodeList e iterar a través del objeto. Si el objeto es un Array, podemos hacer esto fácilmente usando .map() o .forEach(). Por suerte, podemos hacerlo:


En javascript, Array es sólo un objeto. Y también NodeList. Por lo tanto, usar los métodos del prototipo de un Array con un objeto diferente está bien, siempre y cuando sea un objeto similar a un Array.


Un NodeList contiene una colección de claves en número, y una clave de longitud, por lo que es similar a un Array.


  Obten el codigo utilizado aqui


¡Gracias por llegar hasta aquí!


Reactions

6

0

0

0

Access hereTo be able to comment

TheWhiteCode.com is not the creator or owner of the images shown, references are: