Aprende cuándo usar llamar (call) y cuándo usar aplicar (apply) en tu código.

Formas de llamar a una función

Hay 3 formas de ejecutar una función en javascript. Dada la siguiente función inversa (esta función de ejemplo devuelve una cadena invertida):

var reverse = function(text){
  return text.split("").reverse().join("");
};

// Or

function reverse(text){
  return text.split("").reverse().join("");
}

Podríamos ejecutarlo como:

propiedad call

La propiedad de llamada le permite ejecutar una función y cambiar el thiscontexto correctamente, seguido de los parámetros específicos separados por una coma como lo hace normalmente con una función normal.

var animals = [
  { species: 'Lion', name: 'King' },
  { species: 'Whale', name: 'Fail' }
];

for (var i = 0; i < animals.length; i++) {
  (function(i) {
    this.print = function() {
      console.log('#' + i + ' ' + this.species
                  + ': ' + this.name);
    }
    this.print();
  }).call(animals[i], i);// Cambia el contexto this al objeto animal.
}

propiedad apply

apply es muy similar a call, excepto por el tipo de argumentos que admite. Puede utilizar una matriz de argumentos en lugar de un conjunto de parámetros con nombre. Con aplicar, puede usar un literal de matriz o una variable de matriz.

El siguiente ejemplo anula el método console.log. Sin embargo, queremos hacer lo mismo que hace console.log pero algo antes y algo después, por lo tanto, usamos applypara ejecutar el método original console.log, por lo que no tenemos que preocuparnos por la posición de los argumentos, ya que ser enviados de la misma manera que vinieron. Tenga en cuenta que la variable de argumentos es una matriz ( obtenga más información sobre los argumentos de palabras clave dentro de una función aquí ).

var originalLog = console.log;
console.log = function() {
    // Haz algo antes de ejecutar algo
    AnImaginaryFunctionThatDoesSomething(arguments);
    // Llame a la función como se habría llamado normalmente:
    // Tenga en cuenta que con aplicar cambiamos este contexto y enviamos
    originalLog.apply(this, arguments);
    // Ejecute otra cosa después de la consola original.log
};

ejecutar directamente

Nada se romperá si ejecuta una función directamente si decide invocar una función directamente. Sin embargo, no puede cambiar el thiscontexto y los parámetros siempre estarán limitados como lo hace la propiedad de llamada.

Solo necesita verificar si la variable es una función antes de ser invocada.

if(typeof(reverse) === "function"){
    reverse("otto");
}

Cuál es la diferencia

¿No notó la diferencia entre ellos con los ejemplos anteriores ?. No hay problema, la diferencia entre solicitar y llamar es realmente simple. Vea el siguiente ejemplo:

var teacher = function(name, age, area) {
    console.log("My name is " + name + ", i'm "+age+" years old and i'm a " + area + " teacher. The context of this is " + this);
};

teacher("John", 20, "History");
teacher.apply(true, ["Patty",23,"Music"]);
teacher.call(undefined, "Bruce", 44 ,"Mathematics");

// Imprime
//My name is John, i'm 20 years old and i'm a History teacher. The context of this is [undefined]
//My name is Patty, i'm 23 years old and i'm a Music teacher. The context of this is [true]
//My name is Bruce, i'm 44 years old and i'm a Mathematics teacher. The context of this is [undefined]

Realizan la misma tarea, ejecutan una función. La única diferencia es la forma en que se pueden enviar los argumentos y cuántos argumentos se pueden proporcionar .

  • aplicar , llamar o invocar directamente una función, simplemente la ejecutará , con o sin argumentos.
  • El thiscontexto se puede cambiar solo en los métodos de aplicación y llamada.
  • Invocar directamente una función o usar la llamada no permite parámetros dinámicos, por lo tanto, se declaran explícitamente (si se declaran 5 parámetros, solo se enviarán 5).
  • El uso de aplicar le permite enviar parámetros dinámicamente a la función (parámetros ilimitados, si la matriz como segundo parámetro tiene 500 elementos, la función recibirá respectivamente los 500 elementos de la matriz como parámetros).

Recuerde que el primer y segundo parámetro de apply()call() son opcionales, no obligatorios. Por lo tanto, son solo otra forma de ejecutar una función pero con personalización permitida. Por lo tanto, no existe una forma recomendada de ejecutar una función, ya que la que elija solo debe adaptarse a sus necesidades.


Interesado en la programación desde los 14 años, Carlos es un programador autodidacta, fundador y autor de la mayoría de los artículos de Our Code World.

Conviertete en un programador más sociable

Patrocinadores