Ответ
В проекте интернет-магазина использовал Observer для управления состоянием корзины. При добавлении товара корзина уведомляла все подписанные компоненты (список товаров, мини-корзину, счетчик) о изменениях.
class Cart {
constructor() {
this.subscribers = [];
this.items = [];
}
subscribe(callback) {
this.subscribers.push(callback);
}
addItem(item) {
this.items.push(item);
this.notify();
}
notify() {
this.subscribers.forEach(cb => cb(this.items));
}
}
// Использование
const cart = new Cart();
cart.subscribe(items => console.log('Items updated:', items));
cart.addItem({id: 1, name: 'Phone'}); // Логирует обновлениеОтвет 18+ 🔞
Да ты посмотри, какой я архитектор, блядь! Сижу, значит, пишу этот интернет-магазин, и понимаю — хуйня получается. Все компоненты друг про друга знают, как соседи по общаге, которые в холодильник друг у друга заглядывают. Пиздец бардак.
И тут я вспоминаю, есть же паттерн такой, Observer, наблюдатель, блядь. Суть проще, чем кажется, ёпта. Вот представь: есть у тебя корзина — она главная, царь и бог. А вокруг неё куча голодных глаз смотрят: список товаров, мини-корзина в углу, счётчик сверху. Им всем позарез надо знать, когда там что-то поменялось.
Так вот, корзина — это не какая-нибудь хитрая жопа, которая сама бегает и всем кричит. Нет. Она говорит: «Кто хочет знать, когда у меня товары меняются — подписывайтесь, суки, вот на этот листочек!». И все желающие пишут свои имена (точнее, функции-колбэки) в её список subscribers.
А дальше магия, блядь. Добавил товар — корзина не дергает всех по отдельности. Она просто берёт свой список подписчиков и орет на всю деревню: «Эй, пацаны, обновились данные, нате!». И каждый компонент сам уже знает, что ему делать с этими новыми данными. Красота, ёбана!
Вот смотри, как это в коде выглядит, тут всё честно:
class Cart {
constructor() {
this.subscribers = [];
this.items = [];
}
subscribe(callback) {
this.subscribers.push(callback);
}
addItem(item) {
this.items.push(item);
this.notify();
}
notify() {
this.subscribers.forEach(cb => cb(this.items));
}
}
// Использование
const cart = new Cart();
cart.subscribe(items => console.log('Items updated:', items));
cart.addItem({id: 1, name: 'Phone'}); // Логирует обновлениеВидишь? Создали корзину. Мини-корзина подписалась через subscribe, передала свою функцию. Как только кинули в корзину телефон — addItem — внутри сразу notify() дергается. И он, этот notify, пробегается по всем подписчикам и каждому вручает свежий список товаров. Мини-корзина получает, обновляется, счётчик пересчитывается — все довольны, ни одной лишней связи, блядь.
И самое охуенное — если завтра понадобится ещё какой-нибудь компонент, который цену итоговую считает, ты его просто подписываешь. Корзину вообще не трогаешь! Она уже всё умеет. Вообще красота, в рот меня чих-пых. Раньше бы ты полдня провозился, переплетая всё между собой, а тут — раз, и готово. Паттерны, блядь, иногда реально жизнь облегчают.