カテゴリー別アーカイブ: ECMAScript the 6th Edition

Object.observeを試してみた

Chromeでは既に実装されているObjectクラスのobserveメソッド. AngularJSで言うところの, $scope.$watchのようなメソッドです.

// 監視対象のオブジェクト
var obj = {};

// オブジェクトの監視
Object.observe(obj, function(changes) {
    // 監視対象のオブジェクトが変更された場合に実行されるコールバック関数

    // 第1引数は変更情報を格納したオブジェクトの配列
    changes.forEach(function(element) {
         console.log(element.name);  // -> 変更されたプロパティ名
         console.log(element.type);  // -> 追加なら'add', 更新なら'update', 削除なら'delete'
         console.log(element.oldValue);  // -> 変更前の値
    });
});

プロパティの追加

obj.a = 'add';

// 出力
// a
// add
// undefined

プロパティの更新

obj.a = 'update';

// 出力
// a
// update
// add

プロパティの削除

delete obj.a;

// 出力
// a
// delete
// update

Object.observe()