Array.observe()

La méthode Array.observe() est utilisée afin d'observer les modifications apportées à un tableau de façon asynchrone. Elle fonctionne de la même façon que la méthode Object.observe() pour les objets. Cette méthode fournit un flux de changements, triés dans l'ordre dans lequel ils se sont produits. Utiliser cette méthode est équivalent à appeler Object.observe() avec la liste ["add", "update", "delete", "splice"] comme troisième argument. Toutefois, cette API a été dépréciée et retirée des navigateurs. Il est préférable d'utiliser l'objet Proxy, plus générique, à la place.

Syntaxe

Array.observe(arr, callback)

Paramètres

arr

Le tableau qu'on souhaite observer.

callback

La fonction à appeler à chaque fois que des changements sont effectués. Cette fonction est appelée avec l'argument suivant :

changes

Un tableau d'objets représentant chacun une modification. Les propriétés de ces objets sont :

• name : Le nom de la propriété qui a été modifiée.
• object : Le tableau modifié (une fois que la modification a été effectuée).
• type : Une chaîne de caractères indiquant le type de modification qui a eu lieu. Elle peut valoir "add" (pour ajout), "update" (pour modification), "delete"(pour suppression) ou "splice" (pour découpage).
• oldValue : Propriété présente uniquement lorsque le type vaut "update" ou "delete". La valeur de la propriété est la valeur avant qu'elle ait été modifiée.
• index : Propriété présente uniquement lorsque le type vaut "splice". L'index auquel la modification a eu lieu.
• removed : Propriété présente uniquement lorsque le type vaut "splice". Le tableau des éléments supprimés.
• addedCount : Propriété uniquement présente lorsque le type vaut "splice". Le nombre d'éléments ajoutés.

Description

La fonction callback est appelée à chaque fois qu'un changement est apporté à arr, elle est appelée avec un argument qui est un tableau contenant tous les changements qui se sont produits, dans l'ordre dans lequel ils se sont produits. 

Exemples

Enregistrer les différents types de modifications

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'], addedCount: 3}]

Spécifications

Proposition de spécification (Strawman proposal) (en anglais).

Compatibilité des navigateurs

[1] Dépréciée avec Chrome 49, désactivée via un marqueur avec Chrome 50 et complètement retirée à partir de Chrome 52.

Voir aussi

• Array.unobserve()
• Object.observe()
• Sous quelles conditions, Array.observe déclenche un événement « add » ?