ObservableArray is able to notify its change through events of four basic operations including 'insert', 'remove', 'replace', 'reset'. ObservableArray implements most used methods including 'push', 'pop', and 'splice'. Due to the syntax limitation it provides 'get' and 'set' for manuplication values stored in the array. 'reset' is also provided for replacing te entire array with another one. In addition to these methods, methods including 'forEach', 'map', 'every', 'some', 'indexOf', 'lastIndexOf', 'reduce', and 'reduceRight'.
ObservableArray creation: It can be initialized by an ordinary array. If the array is not given, an empty is used by default.
- Source:
Examples
var observableArray = ObservableArray([1, 2, 3]);
Events:
Information regarding the operation is provided in the event detail. Please
check the following example:var observableArray = ObservableArray([1, 2, 3]);
var handler = {
handleEvent: function(event) { console.log(JSON.stringify(event)); }
}
observableArray.addEventListener('insert', handler);
observableArray.addEventListener('remove', handler);
observableArray.addEventListener('replace', handler);
observableArray.addEventListener('reset', handler);
observableArray.push(4);
// observableArray is [1, 2, 3, 4]
// event.type is 'insert'
// event.detail is {index: 3, count: 1, items: [4]}
observableArray.pop();
// observableArray is [1, 2, 3]
// event.type is 'remove'
// event.detail is {index: 3, count: 1, items: [4]}
observableArray.set(2, 4);
// observableArray is [1, 2, 4]
// event.type is 'replace'
// event.detail is {index: 2, oldValue: 3, newValue: 4}
observableArray.reset([1, 2, 3]);
// observableArray is [1, 2, 3]
// event.type is 'reset'
// event.detail is {items: [1, 2, 3]}
observableArray.splice(2, 1, [4, 5, 6]);
// observableArray is [1, 2, 4, 5, 6]
// First event:
// event.type is 'remove'
// event.detail is {index: 2, count: 1, items: [3]}
// Second event:
// event.type is 'insert'
// event.detail is {index: 2, count: 3, items: [4, 5, 6]}