El mètode Object.observe() s'utilitza per observar asincrònicament els canvis en un objecte. Proveeix una corrent de canvis en l'ordre en què es produeixen.

Sintaxi

Object.observe(obj, callback[, acceptList])

Paràmetres

obj
L'objecte que s'observa.
callback
La funció es crida cada cop que es realitzen canvis, amb l'argument següent:
changes
Un array d'objectes cadascún d'ells representa un canvi. Les propietats d'aquests objectes canvi són:
  • name: El nom de la propietat que s'ha canviat.
  • object: L'objecte canviat després d'haverse realitzat els canvis.
  • type: Una cadena que indica el tipus de canvi que s'ha portat a terme: "add", "update", o "delete".
  • oldValue: Només pels tipus "update" i "delete". El valor abans del canvi.
acceptList
La llista de tipus de canvis que s'han d'observar en l'objecte donat  callback. En cas d'ometre's, s'utilitzarà l'array ["add", "update", "delete", "reconfigure", "setPrototype", "preventExtensions"].

Descripció

callback és cridat cada cop que es realitza un canvi a obj, amb un array de tots els canvis en l'ordre en que han succeït.

Exemples

Mostrant tots els sis tipus diferents

var obj = {
  foo: 0,
  bar: 1
};

Object.observe(obj, function(changes) {
  console.log(changes);
});

obj.baz = 2;
// [{name: 'baz', object: <obj>, type: 'add'}]

obj.foo = 'hello';
// [{name: 'foo', object: <obj>, type: 'update', oldValue: 0}]

delete obj.baz;
// [{name: 'baz', object: <obj>, type: 'delete', oldValue: 2}]

Object.defineProperty(obj, 'foo', {writable: false});
// [{name: 'foo', object: <obj>, type: 'reconfigure'}]

Object.setPrototypeOf(obj, {});
// [{name: '__proto__', object: <obj>, type: 'setPrototype', oldValue: <prototype>}]

Object.seal(obj);
// [
//   {name: 'foo', object: <obj>, type: 'reconfigure'},
//   {name: 'bar', object: <obj>, type: 'reconfigure'},
//   {object: <obj>, type: 'preventExtensions'}
// ]

Enllaçar dades

// Un model d'usuari
var user = {
  id: 0,
  name: 'Brendan Eich',
  title: 'Mr.'
};

// Crear una benvinguda per l'usuari
function updateGreeting() {
  user.greeting = 'Hello, ' + user.title + ' ' + user.name + '!';
}
updateGreeting();

Object.observe(user, function(changes) {
  changes.forEach(function(change) {
    // Qualsevol canvi de nom del temps o títol, actualitzar la benvinguda
    if (change.name === 'name' || change.name === 'title') {
      updateGreeting();
    }
  });
});

Tipus de canvi personalitzat

// Un punt en un pla 2D
var point = {x: 0, y: 0, distance: 0};

function setPosition(pt, x, y) {
  // Performing a custom change
  Object.getNotifier(pt).performChange('reposition', function() {
    var oldDistance = pt.distance;
    pt.x = x;
    pt.y = y;
    pt.distance = Math.sqrt(x * x + y * y);
    return {oldDistance: oldDistance};
  });
}

Object.observe(point, function(changes) {
  console.log('Distance change: ' + (point.distance - changes[0].oldDistance));
}, ['reposition']);

setPosition(point, 3, 4);
// Distance change: 5

Especificacions

Proposta de Strawman per ECMAScript 7.

Compatibilitat amb navegadors

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suport bàsic 36 No support [1] No support [2] 23 No support
Característica Android Chrome per Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suport bàsic No support 36 No support [1] No support [2] 23 No support

[1]: Vegeu errada 800355

[2]: Vegeu rellevant entrada de l'estat de la plataforma MS Edge

Vegeu també

Document Tags and Contributors

Contributors to this page: wbamberg, teoli, llue
Last updated by: wbamberg,