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
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