object-live
v1.0.6
Published
Create observable object. You can work with it as with a regular hash, while using subscriptions to the events of adding an element, changing and deleting
Downloads
38
Maintainers
Readme
This library allows you to create tracked objects. You can work with it as with a regular hash, while using subscriptions to the events of adding an element, changing and deleting
Usage:
Install
npm -i object-live
Import library in your code:
import ObjectLive from "object-live";
Create object
Create new observable object:
const obj = new ObjectLive();
Now obj
has observable property data
, you can set any object to it
Example:
obj.data = {
animals: {
cat: {name: 'Bob', age: 1},
dog: {name: 'Alice', age: 2},
monkey: {name: 'FooBar', age: 3}
}
};
or create with initial data:
const obj2 = new ObjectLive({myanydata: {foo: 'bar'}});
Subscribe to some events.
For subscription, you can specify the path to the end property, Examples:
obj.addEventListener('change', 'animals.cat.age', (res) => {
console.log('old value:', res.oldValue); // res contains properties: 'oldValue' and 'newValue'. Use it to catch changes
console.log('new value:', res.newValue);
});
obj.addEventListener('change', 'animals.dog.name', console.log);
or using the regexp as mask in path:
obj.addEventListener('change', /^animals\.(.*)\.age/, console.log); //subscribe to ages of cat, dog and monkey
when you change the age
value, the change
event will be fired:
obj.data.animals.cat.age = 19;
You can set new property in object and get set
event:
obj.addEventListener('set', /.*/, res => {
console.log(res);
});
obj.data.animals.cat.balance = '100$';
You can catch delete
event:
obj.addEventListener('delete', /^animals\.(.*)/, console.log);
delete obj.data.animals.monkey;
Enjoy
It's easy to use and very fast, you can create objects containing 10k+ trackable properties and not worry about performance