EventEmitter на JavaScript.
ฝัง
- เผยแพร่เมื่อ 22 ส.ค. 2024
- Всем привет! Это рубрика ДавайЗакодим. В этом выпуске мы закодим один из популярных паттернов проектирования - EventEmitter.
Канал и чат в телеграме: t.me/first_fil...
Ссылка на код: github.com/ooo...
#frontend #js #javascript #web #урокипрограммирования #первыйфайлкомом #webdeveloper #давайзакодим #desingpatterns
#паттерныпроектирования #pubsub #eventEmitter
Работа с событиями полезная фича. Чайник включился :-) Спасибо. 👍
Даа, полезная штука. На практике частенько использую к ней еще можно прикрутить postMessage и вообще пушка
Это лучшее объяснение и пример! Спасибо!
Спасибо, очень понятно и просто объяснил!
Объяснение топчик 👍
мне как новичку который дошел до асинхронщины синтаксис непонятен, к сожалению первый раз вижу такие приватные поля, вместо привычного конструктора ((
Привет! Вероятнее всего ты пропустил ролик на канале посвященный классам! Обязательно посмотри его =)
th-cam.com/video/P2D647LZWAk/w-d-xo.html
@@first-file-comom Да, мне тоже непонятен этот синтаксис. Что за #listeners = {} вместо конструктора?
@@ultexplorer поля или методы которые начинаются с решетки являются приватными. т.е. к ним нельзя обратить когда создан инстанс класса. Рекомендую посмотреть видео про классы на канале.
th-cam.com/video/P2D647LZWAk/w-d-xo.htmlsi=sqKgOM_aZ_KIuuc-
А по поводу конструктора - его необязательно указывать при создании класса
const EventEmitter = function(){
this.events = {}
}
EventEmitter.prototype.on = function (name, fn){
const event = this.events[name];
if(event) event.push(fn);
else this.events[name] = [fn];
}
EventEmitter.prototype.emit = function (name, ...data) {
const event = this.events[name];
if(event) event.forEach(fn => fn(...data))
}
@@ultexplorer думаю нужно больше учить синтаксис языка, раз такого не знаете
Почему две распечатки происходит? Первый - нормальный, второй - с отпиской?
Две распечатки, потому что в коде есть две подписки на одно и тоже событие умноженное на количество вызовов этого события (dispatch). Поэтому в консоль вывелось две.
Там где происходит сохранение в переменную unsub это та же подписка, просто мы сохранили функцию (коллбэк) в переменную которая вернул метод subscribe.
Дай пожалуйста название темы Vs code пожалуйста 💜
One dark material design