From 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:43:23 -0500 Subject: initial commit --- .../global_objects/object/observe/index.html | 153 +++++++++++++++++++++ 1 file changed, 153 insertions(+) create mode 100644 files/uk/web/javascript/reference/global_objects/object/observe/index.html (limited to 'files/uk/web/javascript/reference/global_objects/object/observe/index.html') diff --git a/files/uk/web/javascript/reference/global_objects/object/observe/index.html b/files/uk/web/javascript/reference/global_objects/object/observe/index.html new file mode 100644 index 0000000000..ec4d1ca5e8 --- /dev/null +++ b/files/uk/web/javascript/reference/global_objects/object/observe/index.html @@ -0,0 +1,153 @@ +--- +title: Object.observe() +slug: Web/JavaScript/Reference/Global_Objects/Object/observe +tags: + - JavaScript + - Об'єкт + - застарілий + - метод +translation_of: Archive/Web/JavaScript/Object.observe +--- +
{{JSRef}} {{obsolete_header}}
+ +

Метод Object.observe() використовувався для асинхронного спостереження за змінами у об'єкті. Він надавав послідовність змін у порядку виникнення. Однак, цей API застарілий та був прибраний з переглядачів. Ви можете, натомість, скористатись більш загальним об'єктом {{jsxref("Proxy")}}.

+ +

Синтаксис

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

Параметри

+ +
+
obj
+
Об'єкт для спостереження.
+
callback
+
Функція, яка викликається кожен раз, коли відбуваються зміни, з наступним аргументом: +
+
changes
+
Масив об'єктів, кожен з яких відображає зміну. Властивості цих об'єктів змін: +
    +
  • name: Ім'я властивості, яка була змінена.
    • +
  • object: Змінений об'єкт після того, як відбулася зміна.
    • +
  • type: Строка, що вказує тип зміни. Один з "add", "update" або "delete".
    • +
  • oldValue: Тільки для типів "update" та "delete". Значення перед зміною.
    • +
+
+
+
+
acceptList
+
Список типів змін для спостереження на наданому об'єкті для наданої функції callback. Якщо не заданий, буде використаний масив ["add", "update", "delete", "reconfigure", "setPrototype", "preventExtensions"].
+
+ +

Значення, що повертається

+ +

Об'єкт для спостереження.

+ +

Опис

+ +

Функція 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 = 'привіт';
+// [{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'}
+// ]
+
+ +

Зв'язування даних

+ +
// Модель користувача
+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();
+    }
+  });
+});
+
+ +

Користувацький тип зміни

+ +
// Точка на 2-вимірній площині
+var point = {x: 0, y: 0, distance: 0};
+
+function setPosition(pt, x, y) {
+  // Виконуємо користувацьку зміну
+  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('Зміна відстані: ' + (point.distance - changes[0].oldDistance));
+}, ['reposition']);
+
+setPosition(point, 3, 4);
+// Зміна відстані: 5
+
+ +

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

+ +

Strawman proposal specification.

+ +

Сумісність з веб-переглядачами

+ +
+ + +

{{Compat("javascript.builtins.Object.observe")}}

+
+ +

Див. також

+ + -- cgit v1.2.3-54-g00ecf