Логика корзины товаров / Подсчёт подытога и итоговой суммы
Вставка
- Опубліковано 21 вер 2024
- В этом видео разберем один из вариантов подсчёта стоимости товаров и реализацию итоговой суммы заказа. Будем писать только JavaScript, поскольку вёрстка тут не имеет особого значения (и поэтому тут Bootstrap).
😎 Получить исходники и другие преимущества - boosty.to/prostorazrabotka
❓ Запись на консультацию - prosto-razrabotka.ru/
✨ Telegram канал - t.me/prostorazrabotka/
🔥 Telegram чат - t.me/prostorazrabotkachat/
Можете добавиться в друзья:
📷 Instagram - instagram.com/vitaliy.kirenkov/
📘 ВКонтакте - vk.com/vitaliy.kirenkov/
📗 Facebook - facebook.com/vitaliy.kirenkov/
📙 LinkedIn - www.linkedin.com/in/kirenkov/
✏️ Twitter - twitter.com/VitaliyKirenkov/
А так же, подписаться на страницы:
📘 ВКонтакте - vk.com/public195137161/
📗 Facebook - facebook.com/prostorazrabotka/
Однажды тестировщик программ заходит в бар.
Забегает в бар.
Пролезает в бар.
Танцуя, проникает в бар.
Крадется в бар.
Врывается в бар.
Прыгает в бар
и заказывает:
кружку пива,
2 кружки пива,
0 кружек пива,
999999999 кружек пива,
ящерицу в стакане,
-1 кружку пива,
qwertyuip кружек пива.
=)))))))))))))))))))))
Первый реальный клиент заходит в бар и спрашивает, где туалет. Бар вспыхивает пламенем, все погибают.
Автору спасибо за видео, очень круто! :)
Если вдруг кому интересно попрактиковаться, развлечения ради данный функционал можно расширить следующим образом:
1. Добавляем возле товара переключалку c режимом добавления товара в корзину поштучно и упаковкой. Когда переключаемся на упаковку, то при добавлении товара нажатием на плюс округляем товар таким образом, чтобы итоговое кол-во было кратным кол-ву в упаковке. Аналогично по нажатию на минус. Опционально можно сделать, чтобы у некоторых товаров была скидка, когда мы решили переключить на упаковку. Можно глянуть примеры, как это выглядит в разных интернет магазинах
2. Добавляем где-нибудь внизу поле с промокодом, после ввода которого к определенным товарам по прописанной логике применяется скидка. Тут уже можно дать волю фантазии)
Даже если задача эта задача кажется легкой и сейчас её решение мне не особо интересно, но рассказываешь и показываешь так интересно, что всё видео посмотрел. Спасибо
все очень класно - а где брови ?
Круто когда в качестве переменной в квадратных скобках делают деструктуризацию массива даже ничего не говоря толком, но потом на следующей же строке разбирают как работает += Если это юмор такой, то лайк конечно. Если нет, то было бы неплохо и то тоже в таком случае объяснять.
У меня последние 10 видео про js и почти в каждом есть деструктуризация. В каждом видео про это рассказывать... увольте...
))) Ну да.. это типа: здесь у нас сиракузская проблема, числа-градины.. ну с этим всё ясно.. а вот здесь ниже 2+2 равно 4, это если 1+1+1+1, если кто не понял )))
Круто! А можешь про запросы рассказать. CORS всякие там,пост запросы и т.д)
Спасибо! Очень интересно
Благодарю -)
Вот такое вот видео вышло -) Лайк?)
Все это миллион раз обжевано. Но как на счет того, чтоб сделать какой-то хитрый и сложный компонент, который сложно трансформируется на мобилках и имеет отличную логику работу от десктопа. И все это одним кодом, без дублей. Я за уникальный контент, а не повторение одного и того же.
@@profesor08 подсчёт суммы, который на десктопе делается одним образом, а на мобиле другим?! Вы в своём уме?
@@profesor08 ну так не смотрите в миллионный раз одно и то же)
@@prosto_razrabotka отображение, взаимодействие пользователя с калькулятором. Что-то действительно сложное, нестандартное, что подарит новый опыт для зрителя.
Привет! Ты недавно постил gsap, было бы здорово что-то по нему посмотреть от тебя :)
За корзину лайк
Спасибо. На счёт гсапа подумаю.
Спасибо, крутой! Я учусь поэтому довольно не просто уследить за всем при просмотре видео, но думаю если параллельно отрабатывать в vscode то все будет понятно. Можно и лайтовее все пояснять, но тогда мозг вообще работать не будет
Отлично. Все просто и понятно. Правда проверку на 0 лучше сделать >= 0.
Есть такое... согласен)
Конечно лайк. Не считая forEach к которому у меня "личнайа неприязьн" все круто
Ну... бывает -)
Крутяк!
Спасибо)
Благодарю за материал!
Вообще странный покупатель, который хочет купить 0 товаров. Я делаю минимально 1 позицию при итерации уменьшения. if > 1.
У тебя есть 3 строки - первые две это товары, третья - итоговая сумма товаров. Что общего у них? Есть ли повторяющиеся, шаблонные элементы? Да - цена. В первой строке - 2 000 руб., во второй строке - 10 000 руб. и в третьей строке - 12 000 руб. ... Так... стоп! Если глаз видит повторяемость, шаблонность элементов, то почему их разметка в html отличается? Почему у Итого есть разбитие на цифру (12000) и на валюту (руб.), а у товаров это тупо как текст написано, а не так же разбито? В итоге бы у тебя функция init() по единому шаблону считала Итого, а так же слушатель клика считал общую цену одного товара по тому же шаблону. ... Проблема с отрицательными числами - если input.value НЕ меньше 1. А то развели моду "не равно 0" =)))))))))))))) Сейчас школьных хакеров набежит и поломает ваше "не равно 0" через консоль, задав кол-во товаров -999. Минус 999 это точно не равно 0 =))) Признавайся, ты специально это делаешь, что бы забайтить народ на комментарии? =))))))))
Спасибо! Очень полезное видео, только итоговую сумму я пересчитал в addEventListener с помошью метода reduce, всего одна строчка получилась:
const amount = [...document.querySelectorAll(".summ_item")].reduce((summ, totalSumm) => summ + Number(totalSumm.innerHTML), 0);
Твои ролики очень классные)
Спасибо)
Много лишнего кода. можно было просто текстовый элемент валюты вынести за элемент. В другой спан например. Так же будет актуально при создании много валютной корзины. или я не прав?
Благодарю за видео. Ну скинул бы архив для тернировки...
А почему бы самому не написать код? Для тренировки..
Добрый день. Владлен
Подскажите можно ли
найти что-то подобное в принципе? Как лучше поступить ? Писать игру с нуля не
получится точно!
Простая карточная
игра (качество и сложность не важно. лучше что-то по проще..)
HTML, CSS, JS, MySQL
Описание:
Регистрация игрока, Минимум два участника
Спасибо
Подскажи пож. сделал всё как ты на видео, столкнулся с проблемой цифры до 1000 бутстреп отображает без пробелов, а четырехзначные и более с пробелом (пример "969" и "1 000") .Так вот без пробелов считает нормально, а с пробелом не считает subtotal и пишет NaN.
Нифига не понел. До этого уровня мне расти и расти
ёлка: У ТЕБЯ ЗДЕСЬ НЕТ ВЛАСТИ
Ага -)
Давайте попробуем с помощью Реакт.жс
как сделать чтобы не надо было каждый раз чистить историю браузера чтоб обновлялся js css код
извини, я задержался.. CTRL + F5
на айфоне не работает почему-то