let sigi = document.getElementById("Sigi") let chips = document.getElementById("Chips") let beer = document.getElementById("Beer") let button = document.getElementById("button") let input = document.getElementById("input") let select = document.getElementById("Select") let bablo = document.getElementById("Kasa") let sdacha = document.getElementById("sdacha") let kasa = document.getElementById("Kassa") function reducer(state, {type, ШО, СКОКА, БАБЛО}){ //объект action деструктуризируется на три переменных if (!state){ //начальная уборка в ларьке: return { пиво: { Сколько: 100, Цена: 30, }, чипсы: { Сколько: 100, Цена: 20, }, сиги: { Сколько: 100, Цена: 75, }, Касса: 0, Сдача : 0, } } if (type === 'КУПИТЬ') { //если тип action - КУПИТЬ, то: if (СКОКА <= state[ШО].Сколько && БАБЛО - (СКОКА * state[ШО].Цена) >= 0 ) return { ...state, //берем все что было из ассортимента [ШО]: { Сколько: state[ШО].Сколько - СКОКА, Цена: state[ШО].Цена //и уменьшаем то, что покупается на количество }, Касса: state.Касса + (СКОКА * state[ШО].Цена), Сдача: БАБЛО - (СКОКА * state[ШО].Цена) } } return state //если мы не поняли, что от нас просят в `action` - оставляем все как есть } function createStore(reducer){ let state = reducer(undefined, {}) //стартовая инициализация состояния, запуск редьюсера со state === undefined let cbs = [] //массив подписчиков const getState = () => state //функция, возвращающая переменную из замыкания const subscribe = cb => (cbs.push(cb), //запоминаем подписчиков в массиве () => cbs = cbs.filter(c => c !== cb)) //возвращаем функцию unsubscribe, которая удаляет подписчика из списка const dispatch = action => { const newState = reducer(state, action) //пробуем запустить редьюсер if (newState !== state){ //проверяем, смог ли редьюсер обработать action state = newState //если смог, то обновляем state for (let cb of cbs) cb() //и запускаем подписчиков } } return { getState, //добавление функции getState в результирующий объект dispatch, subscribe //добавление subscribe в объект } } const store = createStore(reducer) let шоЛежит = () => { let objectStore = store.getState() sigi.innerText = `Сиги : ${objectStore.сиги ['Сколько']} цена : ${objectStore.сиги['Цена']}` chips.innerText = `Чипсы : ${objectStore.чипсы['Сколько']} цена : ${objectStore.чипсы['Цена']}` beer.innerText = `Пиво : ${objectStore.пиво['Сколько']} цена : ${objectStore.пиво['Цена']}` sdacha.innerText = `Ваша сдача : ${objectStore['Сдача']}` kasa.innerText = `Касса : ${objectStore['Касса']}` bablo.value = `${objectStore['Сдача']}` } let купиШОнибудь = () => ({ type: 'КУПИТЬ', ШО: select.value, СКОКА: input.value, БАБЛО: bablo.value}) button.onclick = () => { store.dispatch(купиШОнибудь()) шоЛежит() } window.onload = () => { шоЛежит() }