123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 |
- 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 в объект
- }
- }
- function reducer(state, {type, ШО, СКОКА, Цена}){ //объект action деструктуризируется на три переменных
- if (!state){ //начальная уборка в ларьке:
- return {
- пиво: {
- количество: 100,
- цена: 38,
- },
- чипсы: {
- количество: 100,
- цена: 21,
- },
- сиги: {
- количество: 100,
- цена: 55,
- }
- }
- }
- if (type === 'КУПИТЬ'){ //если тип action - КУПИТЬ, то:
- return {
- ...state, //берем все что было из ассортимента
- [ШО]: state[ШО] - СКОКА //и уменьшаем то, что покупается на количество
- }
- }
- return state //если мы не поняли, что от нас просят в `action` - оставляем все как есть
- }
- // return {
- //
- // }
- let store = createStore(reducer);
- const actionByeBeer = СКОКА => ({type: 'КУПИТЬ', ШО: 'пиво', СКОКА})
- const actionByeСrisps = СКОКА => ({type: 'КУПИТЬ', ШО: 'чипсы', СКОКА})
- const actionByeSigarets = СКОКА => ({type: 'КУПИТЬ', ШО: 'сиги', СКОКА})
- console.log(store.getState().пиво)
- console.log(store.getState().сиги)
- document.body.append(productCard)
- for (let elementProduct in store.getState()) {
- const productCard = document.getElementById('card')
- const product = document.getElementById('product')
- product.innerText = card
- const amount = document.getElementById('amount')
- amount.innerText = store.getState()[card].количество + `шт`
- const price = document.getElementById('price')
- price.innerText = store.getState()[card].цена + `грн`
- productCard.append(product)
- productCard.append(amount)
- productCard.append(price)
- console.log(card)
- }
- const list = document.createElement("select")
- document.body.append(list)
- const choicePrice = document.createElement('div')
- document.body.append(choicePrice)
- for (let name of Object.keys(store.getState())) {
- let product = document.createElement("option")
- product.innerText = name
- list.append(product)
- }
- const inputAmount = document.createElement('input')
- inputAmount.id = "amount"
- inputAmount.type = 'number'
- inputAmount.min = "0"
- document.body.append(inputAmount)
- let total = document.createElement('div');
- inputAmount.oninput = list.onchange = () => {
- total.innerText = 15 * inputAmount.value;
- }
- document.body.append(total)
- const buttonBuy = document.createElement('button')
- buttonBuy.innerText = 'Купить'
- document.body.append(buttonBuy)
- // buttonBuy.onclick = () => {
- // const actionByeBeer = СКОКА => ({type: 'КУПИТЬ', ШО: 'пиво', СКОКА})
- // }
- const person = {
- name: 'Иван',
- fatherName: 'Иванович',
- surname: "Иванов"
- }
- const {["name"]:nameOrSurname} = person //деструктуризация с использованием ключа, вычисленного с помощью выражения
- console.log(nameOrSurname)
|