JavaScript .llamada() .aplicar() y .bind () – explicado a un noob total

JavaScript tiene una serie de funciones/métodos integrados que se pueden aplicar a varios tipos de datos.

igual que .split(«») puede aplicarse a una cadena, .llamada(), .aplicar() y .bind() son métodos de funciones.

estas 3 funciones están diseñadas para establecer el contexto, o más específicamente, a qué se refiere «esto».

la mayoría de las veces, siempre definirías «esto» o lo incluirías específicamente en una función., Por ejemplo, digamos que tiene un objeto:

var owen = { name: "Owen"}

y desea hacer referencia a este objeto utilizando una función:

function sayTo(person, first, second){ return first + " " + person.name + " " + second;}sayTo(owen, "Hi", "how are you?");
//returns "Hi Owen how are you?"

ahora, si se invoca la función sayTo en Owen, con 2 argumentos, se invocaría correctamente, porque

Ahora, ¿qué pasa si sayTo se define un poco diferente?

el primer argumento, owen, va a la primera variable, «hi» va a la segunda variable, y «how are you?»no va a ninguna parte, y this.name no está definido, porque este no es el objeto owen.

esto cuando consolas.,log it, en realidad devuelve el objeto ventana global.

Usando .call ()

.call () permite que la función sayTo funcione:

la notación es la siguiente:

functionName.call(value of this, arg1, arg2…)

.call esencialmente fuerza el valor en esto en cualquier función .la llamada se aplica. En este caso, invocamos la función sayTo. .call (owen, owen) fuerza a este de sayTo() a ser el objeto owen. Así this.name es aplicable.

«Hola» y «¿cómo estás?»se introducen como el segundo o tercer argumento de la función sayTo (que toma 2 argumentos).

Usando .aplicar()

Usando .,apply() es muy similar a .llamada. La única diferencia es esa .call () toma arg1 y arg2 uno tras otro.

Para .apply() para trabajar, los argumentos 1 y 2 necesitan ser introducidos como una matriz:

el formato es el siguiente:

functionName.apply(value of this, )

observe que arg1 y arg2 son introducidos como una matriz.

Usando .bind ()

.bind (), a diferencia .aplicar() y .call(), devuelve una función en lugar de un valor.

.bind () establece el valor de esto y cambia la función a una nueva función, pero no invoca la función.,

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayToOwen = sayTo.bind(owen);

esencialmente, sayToOwen es crear como una nueva función. Que es técnicamente:

var sayToOwen = function(first, second){ return first + " " + owen.name + " " + second;}

a continuación, puede ejecutar sayToOwen como una función normal.

también puede «enlazar» los argumentos de sayTo() así:

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayHiToOwen = sayTo.bind(owen, "Hi");

La variable sayHiToOwen entonces se convierte en:

var SayHiToOwen = function(second){
return "Hi" + " " + owen.name + " " + second;}

Resumen

Leave a Comment