Array.observe()
El método Array.observe()
se utiliza para poder observar en forma asincrónica los cambios ocurridos en un vector, similar a Object.observe()
para los objetos. Provee un flujo ordenado por orden de ocurrencia de los cambios ocurridos en el vector. Es equivalente a invocar Object.observe()
con la lista de tipos aceptados: ["add", "update", "delete", "splice"]
.
Sintaxis
Array.observe(arr, callback)
Parámetros
arr
- El vector a ser observado.
callback
- La función invocada con cada cambio dentro del vector con el siguiente argumento:
changes
- Un vector de objetos, cada uno representando un cambio. Las propiedades de estos objetos son:
name
: El nombre de la propiedad que ha cambiado.object
: El vector modificado, despues de la modificación.type
: Una cadena de caracteres indicando el tipo de cambio que ocurrió. Estos tipos son:"add"
,"update"
,"delete"
, o"splice"
.oldValue
: El valor antes de ser modificado. Solo para los tipos"update"
o"delete"
.index
: La posición del vector en la que ocurrio el cambio. Sólo para el tipo"splice"
.removed
: Un vector con los elementos borrados. Sólo para el tipo "splice".addedCount
: La cantidad de elementos agregados. Sólo para el tipo "splice".
Descripción
La función callback es invocada cada vez que ocurre un cambio en el vector, recibiendo como parámetro, un vector con todos los cambios ocurridos en el orden en que estos fueron realizados.
Changes done via Array methods, such as Array.prototype.pop() will be reported as "splice"
changes. Index assignment changes which do not change the length of the array may be reported as "update"
changes.
Los cambios realizados por medio de los metodos del objeto Array, como Array.prototype.pop(), seran reportados como del tipo "splice". Los cambios realizados por indice, que no modifican la cantidad de elementos del vector, podrian ser reportados con el tipo "update".
Ejemplos
Mostrando en consola los diferentes tipos de modificaciones
var arr = ['a', 'b', 'c'];
Array.observe(arr, function(changes) {
console.log(changes);
});
arr[1] = 'B';
// [{type: 'update', object: <arr>, name: '1', oldValue: 'b'}]
arr[3] = 'd';
// [{type: 'splice', object: <arr>, index: 3, removed: [], addedCount: 1}]
arr.splice(1, 2, 'beta', 'gamma', 'delta');
// [{type: 'splice', object: <arr>, index: 1, removed: ['B', 'c', 'd'], addedCount: 3}]
Especificaciones
Compatibilidad de Navegadores
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 36 | Sin soporte | Sin soporte | Sin soporte | Sin soporte |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | Sin soporte | (Yes) | Sin soporte | Sin soporte | Sin soporte | Sin soporte |