Function.prototype.apply()

Sintaxis

fun.apply(thisArg[, argsArray])

Parmetros

thisArg

El valor del objeto this a utilizar dentro de la llamada a fun. Cabe mencionar que ste puede no ser el valor visto por el mtodo: si el mtodo es una funcin del tipo non-strict mode, null o undefined ser reemplazado por el objeto global, y los valores primitivos sern encapsulados.

argsArray

Un objeto similar a un array (array like object), que contiene los parmetros con los que ser llamada fun, o null o undefined si ningn argumento es estipulado. Desde la versin 5 de ECMAScript estos parmetros pueden estar en un objeto similar a un array en lugar de un array. Vase browser compatibility para mayor informacin.

Valor de retorno

El resultado de llamar a la funcin con el valor dado this y argumentos.

Descripcin

Puede estipularse un objeto this diferente al llamar una funcin. this se refiere al objeto actual, el objeto haciendo la llamada. Con apply, puede escribirse un mtodo una vez y heredarlo a otro objeto, sin necesidad de reescribir el mtodo para adecuarlo al nuevo objeto.

apply es muy similar a call(), excepto por el tipo de argumentos que soporta. Puede utilizarse un arreglo de parmetros en lugar de un conjunto de pares nombre-valor. Con apply, puede utilizarse un arreglo literal, por ejemplo, fun.apply(this, ['eat', 'bananas']), o un objeto Array, por ejemplo, fun.apply(this, new Array('eat', 'bananas')).

Puede tambin utilizarse arguments como parmetro argsArray. arguments es una variable local a la funcin. Puede utilizarse para acceder a todos los argumentos no especficados en la llamada al objeto. Por lo tanto, no se requiere conocer todos los argumentos del objeto invocado cuando se utiliza el mtodo apply. Puede utilizarse arguments para pasar los argumentos al objeto invocado. El objeto invocado es entonces responsable por el manejo de los argumentos.

Desde la 5ta edicin de ECMAScript se puede utilizar tambin cualquier tipo de objeto similar a un arreglo, que en trminos prcticos significa que tendr una propiedad length y propiedades integer en el rango (0...length). Por ejemplo, ahora puede utilizarse un NodeList o un objeto personalizado como: {'length': 2, '0': 'eat', '1': 'bananas'}.

Ejemplos

Utilizando apply para encadenar constructores

Puedes utilizar apply para encadenar constructors para un objeto, similar a Java. En el ejemplo siguiente se crea un mtodo global a Function llamado construct, en cual posibilita el uso de un objeto similar a un arreglo en un constructor en lugar de una lista de argumentos.

Function.prototype.construct = function (aArgs) {
  var fConstructor = this,
    fNewConstr = function () {
      fConstructor.apply(this, aArgs);
    };
  fNewConstr.prototype = fConstructor.prototype;
  return new fNewConstr();
};

Ejemplo de uso:

function MyConstructor() {
  for (var nProp = 0; nProp < arguments.length; nProp++) {
    this["property" + nProp] = arguments[nProp];
  }
}

var myArray = [4, "Hello world!", false];
var myInstance = MyConstructor.construct(myArray);

alert(myInstance.property1); // alerts "Hello world!"
alert(myInstance instanceof MyConstructor); // alerts "true"
alert(myInstance.constructor); // alerts "MyConstructor"

apply y funciones built-in

El uso inteligente de apply permite utilizar funciones built-in para algunas tareas que, de otra manera, habran sido escritas recorriendo los valores del arreglo dentro de un bucle. Como ejemplo, vamos a utilizar Math.max/Math.min para encontrar el mximo/mnimo valor en un arreglo.

/* min/max number in an array */
var numbers = [5, 6, 2, 3, 7];

/* using Math.min/Math.max apply */
var max = Math.max.apply(
  null,
  numbers,
); /* This about equal to Math.max(numbers[0], ...) or Math.max(5, 6, ..) */
var min = Math.min.apply(null, numbers);

/* vs. simple loop based algorithm */
((max = -Infinity), (min = +Infinity));

for (var i = 0; i < numbers.length; i++) {
  if (numbers[i] > max) max = numbers[i];
  if (numbers[i] < min) min = numbers[i];
}

Pero cuidado: utilizando apply de esta manera ests corriendo el riesgo de exceder el lmite de argumentos permitido por el motor de JavaScript. Las consecuencias de aplicar una funcin con demasiados argumentos (imagnate ms de decenas de miles de argumentos) varan entre los distintos motores (JavaScriptCore tiene un lmite de argumentos fijo de 65536), porque el lmite (de hecho, incluso el comportamiento de cualquier pila excesivamente larga) no est especificado. Algunos motores lanzarn una excepcin. Ms perniciosamente, otros limitarn de manera arbitraria el nmero de argumentos que se estn pasando en realidad a la funcin. (Para ilustrar este ltimo caso: si un motor tuviera un lmite de cuatro argumentos [por supuesto, los lmites reales son significamente mayores], sera como si los argumentos 5, 6, 2 y 3 hubieran sido pasados a apply en los ejemplos anteriores, en lugar del arreglo completo). Si el valor de tu arreglo pudiera crecer en decenas de miles, utiliza una estrategia hbrida: aplica a tu funcin trozos del array a la vez:

function minOfArray(arr) {
  var min = Infinity;
  var QUANTUM = 32768;

  for (var i = 0, len = arr.length; i < len; i += QUANTUM) {
    var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len)));
    min = Math.min(submin, min);
  }

  return min;
}

var min = minOfArray([5, 6, 2, 3, 7]);

Utilizando apply en "monkey-patching"

(Reemplazando de manera dinmica los argumentos en tiempo de ejecucin)

apply puede ser la mejor manera de reemplazar dinmicamente una funcin 'built-in' de Firefox, o de una librera de JavaScript. Dada una funcin someobject.foo, puedes modificar la funcin de una forma 'hacker', como sta:

var originalfoo = someobject.foo;
someobject.foo = function () {
  // Haz algo antes de llamar a la funcin
  console.log(arguments);
  // Llama a la funcin como la hubieras llamado normalmente
  originalfoo.apply(this, arguments);
  // Aqu, ejecuta algo despus
};

Este mtodo es especialmente til cuando quieres depurar eventos, o interfaces con algn elemento que no tiene API, al igual que los diversos .on (eventos[event]...,como los que se usan en el Devtools Inspector)

Especificaciones

Compatibilidad con navegadores

Vase tambin

• arguments objetos
• Function.prototype.bind()
• Function.prototype.call()