Object.observe()

Сводка

Метод Object.observe() используется для асинхронного обзора изменений в объекте. Он предоставляет поток изменений в порядке их возникновения.

Синтаксис

Object.observe(obj, callback)

Параметры

obj

Обозреваемый объект.

callback

Функция, вызываемая при возникновении изменений в объекте, принимает следующий аргумент:

changes

Массив объектов, представляющих одно изменение. Объекты с изменениями содержат следующие свойства:

• name: имя изменённого свойства.
• object: изменённый объект после изменения.
• type: строка, указывающая тип произошедшего изменения. Может принимать одно из значений: "add", "update" или "delete".
• oldValue: только для типов "update" и "delete". Значение до изменения.

Описание

Функция callback вызывается каждый раз при возникновении изменений в объекте obj с массивом всех изменений в порядке их возникновения.

Примеры

Пример: журналирование всех трёх типов изменений

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

Пример: привязка данных

// Пользовательская модель
var user = {
  id: 0,
  name: 'Брендан Айк',
  title: 'М-р.'
};

// Создаёт приветствие для пользователя
function updateGreeting() {
  user.greeting = 'Здравствуйте, ' + user.title + ' ' + user.name + '!';
}
updateGreeting();

Object.observe(user, function(changes) {
  changes.forEach(function(change) {
    // Любое изменение имени или обращения обновит привествие
    if (change.name === 'name' || change.name === 'title') {
      updateGreeting();
    }
  });
});

Custom change type

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

Спецификации

Черновое предложение к обсуждению для ECMAScript 7.

Совместимость с браузерами

Смотрите также

• Object.unobserve()
• Array.observe()