Инициировать событие, когда объект добавляется на карту или набор
Я ищу способ инициировать событие, когда объект добавляется на карту или набор? Как-то так, возможно? Сейчас мы просто используем таймер для проверки.
let mymap = new Map() // or Set()
mymap.on('set', obj => {
console.info(obj)
}
Это мой первый проход, основанный на рекомендациях @PsychoX, мысли?
const EventEmitter = require('events')
const emitter = new EventEmitter()
const Wrapper = () => {
this._set = new Set()
this.get = key => { return this._set.get(key) }
this.add = obj => {
this._set.add(obj)
emitter.emit('add', obj)
}
this.values = () => { return this._set.values() }
}
emitter.on('add', obj => {
console.info('added', obj)
})
let test = new Wrapper()
test.add({hello:'world'})
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Вы можете расширить значение по умолчанию Map или использовать прокси.
Мой подход:
class ObservableMapChangeEvent extends Event {
constructor(observable, key, oldValue, newValue) {
super('change');
this.observable = observable;
this.key = key;
this.oldValue = oldValue;
this.newValue = newValue;
}
}
class ObservableMap extends Map {
constructor(iterable) {
super(iterable);
this._eventTarget = new EventTarget();
}
on(name, listener, options) {
this._eventTarget.addEventListener(name, listener, options);
}
off(name, listener, options) {
this._eventTarget.addEventListener(name, listener, options);
}
delete(key) {
this._eventTarget.dispatchEvent(new ObservableMapChangeEvent(this, key, this.get(key), undefined));
super.delete(key);
}
set(key, value) {
this._eventTarget.dispatchEvent(new ObservableMapChangeEvent(this, key, this.get(key), value));
super.set(key, value);
}
}
// Example:
const foo = new ObservableMap();
foo.on('change', event => {
console.info(`Changes [${event.key}] to '${event.newValue}' (old: '${event.oldValue}')`);
});
foo.set('hello', 'world'); // Changes [hello] to 'world' (old: undefined)
Возможно, вы захотите посмотреть на:
- Как правильно расширить карту ES6
- Есть ли какой-либо EventEmitter на стороне браузера, который имеет аналогичную логику в nodejs?
О, это меня вдохновило, чуть позже опубликую свои результаты .. большое спасибо :D
@BillKervaski О, я тоже пытался сделать это как для упражнений :D
Спасибо! Я опубликовал свой первый проход с использованием эмиттеров событий в вопросе, глядя на ваш пример сейчас. Это отличный материал! Люблю учиться...
Я обновил свой подход в ответе (исправил несколько вещей, так как писал без тестирования). По сравнению с вашим решением, оно может быть более многоразовым. Однако я только сейчас понял, что вы отметили node js, что я проглядел, сосредоточившись на том, чтобы заставить его работать в браузере.
Все супер, большое спасибо!!!
Ага, сегодня я узнал, что у Node тоже есть EventEmitter, так что решение будет работать и для браузера, и для Node :)
Да, это то, что я тестирую, и оно отлично работает. Вы действительно открыли мне глаза на несколько вещей, самоучка, поэтому у меня есть пробелы: D, если бы у вас была баночка для чаевых ...
Создайте свой собственный класс-оболочку вокруг них