es7-object-observe

Introduction

es7-object-observe is Object.observe polyfill without dirty-checking.

``js
const oo = require('es7-object-observe');

const obj = new oo.Object({ foo: 0, bar: 1 });

oo.Object.observe(obj, (changes) => { console.log(changes); });

obj.foo = 'hello';
obj.bar = 'world';
// [
// {name: 'foo', object: , type: 'update', oldValue: 0},
// {name: 'bar', object: , type: 'update', oldValue: 1},
// ]
`

`js
const arr = new oo.Array(['a', 'b', 'c']);

oo.Array.observe(arr, (changes) => { console.log(changes); });

arr[1] = 'B';
arr.splice(1, 2, 'beta', 'gamma', 'delta');
// [
// {type: 'update', object: , name: '1', oldValue: 'b'},
// {type: 'splice', object: , index: 1, removed: ['B', 'c', 'd'], addedCount: 3}
// ]
`

Install

`
npm install es7-object-observe
`

Caveats

es7-object-observe(oo) is based on spec proposal
and almost the same as chrome implementation, but there are some differences.

$3

`js
const obj = oo.Object({ id: 1 });
`

$3

`js
function observer(changes) {
console.log(changes);
}

oo.Object.observe(obj, observer, ['update', 'reconfigure', 'preventExtensions']);

oo.Object.defineProperty(obj, 'a', { enumerable: false });
oo.Object.preventExtensions(obj);
// [
// { object: obj, type: 'reconfigure', name: 'a' },
// { object: obj, type: 'preventExtensions' }
// ]

oo.Object.unobserve(obj, observer);
`

$3

`js
// Bad example; they can't deliver changes.
obj.a = 'b';
delete obj.a;
`

`js
obj.set('a', 'b');
obj.delete('a');
// [
// { object: obj, type: 'add', name: 'a' },
// { object: obj, type: 'delete', name: 'a', oldValue: 'b' }
// ]
`

I prefer to use oo-object with oo.Object.seal,
because it can eliminates the need for uncool 'set' and 'delete'.

`js
oo.Object.seal(obj);

// Another example
class Square extends oo.Object {
constructor(x, y, width, height) {
super({x, y, width, height});
oo.Object.seal(this);
}

scale(ratio) {
Square.getNotifier(this).performChange('scale', () => {
this.width *= ratio;
this.height *= ratio;
return {
ratio: ratio
};
});
}

static observe(square, callback) {
return oo.Object.observe(square, callback, ['update', 'scale']);
}
}
`

$3

`js
const arr = oo.Array([1, 2, 3, 4]);

// arr is not array.
(arr instanceof Array) !== true

// But you can use all methods of Array.
arr.forEach((v) => {
...
});

// You can use for-loop on a browser supporting iterator.
for (let i of arr) {
// not working on IE and Safari...
}

// arr.method which returns 'array' returns 'array', not 'oo-array'.
arr.copyWithin(...); // returns 'normal' array
``

$3