MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Object.observe()

Obsolete
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.

Sommario

Il metodo Object.observe() è usato per l'osservazione asincrona dei cambiamenti di un oggetto. Esso fornisce uno stream dei cambiamenti nell'ordine in cui si verificano.

Sintassi

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

Parametri

obj
L'oggetto che verrà osservato.
callback
La funzione richiamata ogni volta che si verificano delle modifiche, con i seguenti argomenti:
changes
Un array di oggetti di oggetti che rappresentano una modifica. Le properties di questi oggetti sono:
  • name: Il nome della property che è stata modificata.
  • object: L'oggetto modificato dopo che la modifica è avvenuta.
  • type: Una stringa che indica il tipo di modifica in atto. Può essere valorizzata con "add", "update" o "delete".
  • oldValue: Solo per i tipi "update" e "delete". Indica il valore prima della modifica.
acceptList
La lista dei tipi di modifiche che possono essere osservate su un dato oggetto per un dato callback. Se omesso, sarà usato l'array ["add", "update", "delete", "reconfigure", "setPrototype", "preventExtensions"].

Descrizione

La funzione callback è chiamata ogni volta che una modifica viene fatta sull'obj. Ad essa viene passata un'array di tutte le modifiche, nell'ordine in cui si verificano.

Esempi

Esempio: Log di tutti e sei differenti tipi

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'}
// ]

Esempio: Data Binding

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

// Create a greeting for the user
function updateGreeting() {
  user.greeting = 'Hello, ' + user.title + ' ' + user.name + '!';
}
updateGreeting();

Object.observe(user, function(changes) {
  changes.forEach(function(change) {
    // Any time name or title change, update the greeting
    if (change.name === 'name' || change.name === 'title') {
      updateGreeting();
    }
  });
});

Esempio: Tipo di modifica personalizzata

// A point on a 2D plane
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

Specifiche

Argomentazione proposta per ECMAScript 7.

Compatibilita browser

Caratteristica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Supporto base 36 No support No support 23 No support
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Supporto base No support 36 No support No support 23 No support

Vedi anche

Tag del documento e collaboratori

 Hanno collaborato alla realizzazione di questa pagina: DineshMv, claudio.mantuano
 Ultima modifica di: DineshMv,