EventEmitter на JavaScript.

Всем привет! Это рубрика ДавайЗакодим. В этом выпуске мы закодим один из популярных паттернов проектирования - EventEmitter.
Канал и чат в телеграме: t.me/first_fil...
Ссылка на код: github.com/ooo...
#frontend #js #javascript #web #урокипрограммирования #первыйфайлкомом #webdeveloper #давайзакодим #desingpatterns
#паттерныпроектирования #pubsub #eventEmitter

[@2difficult2do]

Работа с событиями полезная фича. Чайник включился :-) Спасибо. 👍

[@first-file-comom]

Даа, полезная штука. На практике частенько использую к ней еще можно прикрутить postMessage и вообще пушка

[@user-qz8kj3tr8i]

Это лучшее объяснение и пример! Спасибо!

[@RefuelTheRocket]

Спасибо, очень понятно и просто объяснил!

[@ginhop1057]

Объяснение топчик 👍

[@manaraga9463]

мне как новичку который дошел до асинхронщины синтаксис непонятен, к сожалению первый раз вижу такие приватные поля, вместо привычного конструктора ((

[@first-file-comom]

Привет! Вероятнее всего ты пропустил ролик на канале посвященный классам! Обязательно посмотри его =)
th-cam.com/video/P2D647LZWAk/w-d-xo.html

[@ultexplorer]

@@first-file-comom Да, мне тоже непонятен этот синтаксис. Что за #listeners = {} вместо конструктора?

[@first-file-comom]

@@ultexplorer поля или методы которые начинаются с решетки являются приватными. т.е. к ним нельзя обратить когда создан инстанс класса. Рекомендую посмотреть видео про классы на канале.
th-cam.com/video/P2D647LZWAk/w-d-xo.htmlsi=sqKgOM_aZ_KIuuc-
А по поводу конструктора - его необязательно указывать при создании класса

[@ultexplorer]

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))
}

[@LHLetale]

@@ultexplorer думаю нужно больше учить синтаксис языка, раз такого не знаете

[@RustemmKh]

Почему две распечатки происходит? Первый - нормальный, второй - с отпиской?

[@first-file-comom]

Две распечатки, потому что в коде есть две подписки на одно и тоже событие умноженное на количество вызовов этого события (dispatch). Поэтому в консоль вывелось две.
Там где происходит сохранение в переменную unsub это та же подписка, просто мы сохранили функцию (коллбэк) в переменную которая вернул метод subscribe.

[@fuckpuc]

Дай пожалуйста название темы Vs code пожалуйста 💜

[@first-file-comom]

One dark material design