Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Array.observe()

Obsolète
Cette fonctionnalité est obsolète. Bien qu'encore supportée par des navigateurs, son utilisation est découragée pour tout nouveau projet. Évitez de l'utiliser.

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. 

Les modifications apportées avec les méthodes d'Array, comme Array.prototype.pop(), seront enregistrées avec le type "splice". Les modifications d'éléments qui ne modifient pas la longueur du tableau sont enregistrés en tant qu'update".

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

Spécifications

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

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari
Support simple 36[1] Pas de support Pas de support Pas de support Pas de support
Fonctionnalité Android Chrome pour Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple Pas de support (Oui) Pas de support Pas de support Pas de support Pas de support

[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

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : SphinxKnight
 Dernière mise à jour par : SphinxKnight,