Рекурсия в JavaScript на простых примерах, хватит ее бояться!
💎 Курс Функции в JavaScript: itgid.info/course/function-2021
⏰ Курс JavaScript 2.0: itgid.info/course/javascript-2
👇 Разверни для полной информации
Курс Методы массивов: itgid.info/course/arraymethod
Изучаем рекурсию в JavaScript. Смотрим как можно от циклов перейти к рекурсии и обратно. Рекурсивный перебор объекта, анимация на рекурсии
00:00 Рекурсия
01:40 Переполняем стек
04:10 Пишем правильную рекурсию
05:00 Аналог рекурсии с помощью цикла
07:20 Аналог цикла с помощью рекурсии
10:00 Программа попрощайка
14:35 Аналог на цикле
18:00 Перебор объектов с помощью рекурсии
24:20 Рекурсия для анимации
32:30 Вычисляем факториал
Пікірлер: 69
Еще нигде не встречал такого суперского объяснения рекурсии. До этого ничерта не понимал, спасибо Вам! Спасибо большое,❤❤❤ Спасибо за то что Вы делаете!❣❣❣
Еще нигде не встречал такого суперского объяснения рекурсии. До этого ничерта не понимал, спасибо Вам!
Классно объяснили. Спасибо огромное за качественный контент!🤩🤩🙏
Задачи на рекурсию объектов просто круть)) приходиться думать. Спасибо!
Супер! У вас просто дар доступно излагать сложный материал!
Александр, спасибо за то что Вы делаете!
Ну вы издеваетесь?)) Только учебу закончил, а тут долгожданный урок, оставлю на завтра. Спасибо за ваш труд
Спасибо вам большое, вы реально топ! Реально учусь сам и каждая тема вызывает абсолютное непонимание , пока не начну смотреть ваши уроки. Просто пушка рил Сэр!
Как всегда супер. Вы первый за долгое время кто наконец-то обьяснил без фибоначи. У меня маленкие замечания, прошу не пинайте. Случай про лицо с низкой соц.... Момент без рекурсии. for(;;) как и while(true) тоже красив. Исходя из условия остановки можно было сделать for(;sum
@AntonioBenderas
2 жыл бұрын
Если хотите while, то не забывайте, что надо дописывать отдельно переменную и счётчик
Це найкраще пояснення рекурсії!
Спасибо большое Александр! Все доступно и понятно!
Спасибо большое, как всегда очень круто и просто объяснили!
на 17:45 возникла сразу идея не делать бесконечный не нужный цикл while (true) , а мы же знаем свой потолок по сумме (то что в if) , так что всё это переезжает в while , тоесть будет while (s2
спасибо за видео! Всё очень понятно
Потрясающее объяснение!
Видос топ , как раз проходил эту тему в курсе по ДЖС и на схожих примерах , только более извращенных (вложенность++) объясняли рекурсию , следующая задача же была на факториал , сидел гадал так же как как и с фибоначи , спасибо за ваше объяснения , сложно - легко объяснить, а вот легко объяснить - тяжело.
Хорошо и подробно, спасибо!
Действительно, очень классный урок
14:45 ( как по мне циклом здесь сделать проще)) iterationMoney = 0; //Кол-во итераций ( сколько раз ему закинут денежек) for (let sum = 0; sum let money = randomIntrger(0, 100); // Функция рандома, которая реализована в видео sum += money; iterationMoney++; // каждый шаг прибавляет 1 к кол-во итераций }
Спасибо, все понятно
отличный урок, спасибо
Просто шикарное пояснение
спасибо.очень полезно!!!!!!
классно , когда у разраба есть чувство юмора!)))
Анимацию чуть переделал=)) прикольная штука получилась, сделал шкалу с процентами, которая заполняется и потом возвращается в начальное положение, проценты также меняются до 100% и потом 10% =)) также добавил 'width 0.3s ease-in-out' что плавно двигалась document.querySelector('.block').addEventListener('click', function (event) { const animationSelector = document.querySelector('.animation'); const blockSelector= document.querySelector('.block'); const blockPercent= document.querySelector('.percent'); if (typeof blockSelector.initialWidth === 'undefined') { blockSelector.initialWidth = blockSelector.offsetWidth; blockSelector.style.transition = 'width 0.3s ease-in-out'; blockPercent.initialWith = blockPercent.textContent.split('%')[0] } const blockPercentInit = Number(blockPercent.initialWith) const animationWidth = animationSelector.offsetWidth; const animationStepValue = (animationWidth / 25); const recurseEffectTimeOut = 300; const toDefaultBlockTimeout = animationStepValue * recurseEffectTimeOut; let percent = blockPercentInit; function recursionAnimation() { percent += 4; blockPercent.textContent = percent + '%'; setTimeout(() => { let blockWidth = blockSelector.offsetWidth; blockWidth += animationStepValue; blockSelector.style.width = (blockSelector.offsetWidth + animationStepValue) + 'px'; if (blockWidth >= animationWidth) { return null; } recursionAnimation() }, recurseEffectTimeOut) } recursionAnimation() setTimeout(() => { blockSelector.style.width = blockSelector.initialWidth + 'px'; blockPercent.textContent = blockPercentInit + '%'; }, toDefaultBlockTimeout) }) в блоке нужно только добавить ещё один див 8% кому нужны стили так как в коментариях к этому видео я их не нашел написал свои .container { font-family: 'Open Sans', sans-serif; max-width: 800px; margin: auto; text-align: center; } h1, h2 { font-family: 'Roboto Slab', serif; } .animation { display: flex; justify-content: center; } .animation{ display: flex; justify-content: flex-start; border: 1px solid black; height: fit-content; } .block { width: 70px; height: 80px; background-color: orange; cursor: pointer; display: flex; align-content: center; justify-content: center; } .percent{ display: flex; align-items: center; } .percent > span{ margin-left: 1px; } .percent, .percent > span{ color: white; font-weight: bold; }
Спасибо!
Лучший коуч которого я слушала. Хотела бы быть хотя бы на 50% как Алекс Лущенко.
@itgid
2 жыл бұрын
Согласен. Крутой чел
как же сгорел пердак когда кантор начал объяснять рекурсию через факториал . Лайк, подписка
По моему отлично))))
Спасибо. да наплевать на тех, кому нужен факториал) Береги нервы.
сделал рекурсию в одной функции на входе массив mass [ { "category": "V01", "name": "Apple", "children": [ { "category": "V0100", "name": "Mac", "children": [ { "category": "V010000", "name": "MacBook", "children": [] }, код для вывода всего каталога. function recursion(obj, level) { level++; for (let key in obj) { out1.innerHTML += '•'.repeat(level) + obj[key].name + ''; if (obj[key].children !== '[]') { recursion(obj[key].children, level); } } } recursion(mass, 0); в результате выводит: •Apple ••Mac •••MacBook
Спасибо ⚘⚘⚘
Превосходно.
алгоритм "минимакс", отличный пример где можно использовать рекурсию
24:06 Одним циклом обошёлся 👻 const parents = [] function printSurname(users) { for (let name in users) { if (users[name]?.parent) { printSurname(users[name].parent) parents.push(name) } } return parents } console.log(printSurname(users))
Уроки нравятся, учусь по ним. Спасибо. Позволю критику. Пример с факториалом здесь неудачный. Очень желательно, чтобы программист знал математику и алгоритмы. Поэтому часто и просят показать рекурсию на факториале. В математике, факториал n: n! = n * (n-1). Если n = 0, то n! = 1. Все. И функция должна возвращать результат. Никаких промежуточных глобальных переменных. В этом прелесть примера рекурсии на факториале. function fact(n) { if (n === 0) return 1; return n * fact(n - 1) }
@LenaFelica_songwriter
2 жыл бұрын
как это в коде записать? спасибо
@JohnRAYChannel
Жыл бұрын
@@LenaFelica_songwriter хороший вариант через стрелочную с тернарным оператором factorial = (n) => n
спасибо
главное надо понять логическое строение что мы вообще делаем и что мы хотим сделать, без этого мы всегда будем смотреть в консоли верный или неверный результат, а надо чтобы мы сами поняли что сделали и точно знать что будет в результате не смотря в консоли, а то получается мы просто сами не можем создать, и приходится брать где то уже готовый сделанный и вставить а там если что подправить и то с помощью других
@iliyabrook2933
6 ай бұрын
порой кода будет много, и задание как эти будут больше и сложнее во много раз, консолями редко кто пользуется, нужно юзать дебагер, а порой есть похожий огромный код и с багом, и тебе нужно его чинить, знать, где что находится в таких ситуациях за гранью возможного…
Друзья, подскажите, как называется менюшка где можно редактировать текст, делать его жирным, подчеркнутым и т.д. в теге textarea ?
@rumsgam
3 жыл бұрын
Это плагины текстового редактора. Ищи - WYSIWYG редакторы.
Очень классное объяснение рекурсии, нигде такого нет, спасибо!!! Но, у меня блок оранжевый не двигается( в крайнем примере). Как его стилизовать, может кто напишет пожалуйста!!
@romanmegagunko4650
Жыл бұрын
Почитай про position relative / absolute в css
@LenaFelica_songwriter
Жыл бұрын
@@romanmegagunko4650 спасибо)) уже понято давно)
@user-bm8vv7nl3m
5 ай бұрын
@@romanmegagunko4650 Спасибо, спустя год у меня тот же вопрос возник. Ваш совет помог)))
А как двигать этот блок внутри другого блока вправо-вниз-влево и вверх? У меня он застревает на повороте влево?
Сделайте видео как запустить вс коде вот так для вывода кода в консоли браузера. Я уже не один день мучаюсь, а годных видео для новичков нет
почему многие кто обучают темы, тупо показывают только как пишется, но не объясняют что именно там делается по порядку шаг за шагом, что за что отвечает, какие операций там производятся, тупо показывая какие то примеры без объяснении и мы будем так же повторять так же как на видео но мы не поймем почему так происходит
А как добавить условие чтоб бок возвращался назад?
@slagrach
Жыл бұрын
if (position > 400) return animBack(); дошло!
А почему в рекурсии условие поменялось (>= 30 а в цикле в другую сторону)?
@JohnRAYChannel
Жыл бұрын
Думаю 3 месяца спустя ты уже разобрался, но для начинающих объясню В цикле нам нужно совершить итерацию над i 30 раз, то есть повышать на единицу до 30 и останавливать цикл после достижения лимита, но в рекурсии такое условие (i
3:15 11417 Google Chrome; 11155 Node.js 🙃
Вселенная бесконечна, это по поводу что бесконечного ничего не бывает
у меня никуда не поехал(((( не понимаю почему(( анимация через рекурсию
@user-vn8hj5bd9i
2 жыл бұрын
В css .block поставить position:relative
Рекурсия - изи, когда находится на пятой строчке кода и ничего не возвращает.
ну да конечно без знание рекурсии можно работать на фронте :D, тогда ты не инженером будешь а просто человеком который пишет код не понимая да и еще на собеседовании минимум дурак не спросить про рекурсию и кому ты так нуден если что то не понял и подумал да ладно продержусь
есть еще такие варианты , 4 вариант самый простой ------------------------------------------------------------------------------------------ 1 Вариант function fact(n) { if (n === 1){ return 1; } else { return fact(n-1) * n++ } } fact(20) Вывод консоли - 2432902008176640000 ------------------------------------------------------------------------------------------- 2 Вариант function fact(n) { if (n === 2){ return 2; } else { return n * fact(n-1) } } fact(20) Вывод консоли - 2432902008176640000 -------------------------------------------------------------------------------------------- 3 Вариант function fact(n) { if (n === 1){ return n; } else { return n * fact(n-1) } } fact(20) Вывод консоли - 2432902008176640000 ------------------------------------------------------------------------------------------ 4 Вариант function fact(n) { if(n===1)return 1 return n * fact(n-1); } fact(20) Вывод консоли - 2432902008176640000 ------------------------------------------------------------------------------------------ 5 Вариант function fact(n) { if(n===2)return 2 return n * fact(n-1); } fact(20) Вывод консоли - 2432902008176640000 ------------------------------------------------------------------------------------------ 6 Вариант function fact(n) {return n
Спасибо!
Анимацию чуть переделал=)) прикольная штука получилась, сделал шкалу с процентами, которая заполняется и потом возвращается в начальное положение, проценты также меняются до 100% и потом 10% =)) также добавил 'width 0.3s ease-in-out' что плавно двигалась document.querySelector('.block').addEventListener('click', function (event) { const animationSelector = document.querySelector('.animation'); const blockSelector= document.querySelector('.block'); const blockPercent= document.querySelector('.percent'); if (typeof blockSelector.initialWidth === 'undefined') { blockSelector.initialWidth = blockSelector.offsetWidth; blockSelector.style.transition = 'width 0.3s ease-in-out'; blockPercent.initialWith = blockPercent.textContent.split('%')[0] } const blockPercentInit = Number(blockPercent.initialWith) const animationWidth = animationSelector.offsetWidth; const animationStepValue = (animationWidth / 25); const recurseEffectTimeOut = 300; const toDefaultBlockTimeout = animationStepValue * recurseEffectTimeOut; let percent = blockPercentInit; function recursionAnimation() { percent += 4; blockPercent.textContent = percent + '%'; setTimeout(() => { let blockWidth = blockSelector.offsetWidth; blockWidth += animationStepValue; blockSelector.style.width = (blockSelector.offsetWidth + animationStepValue) + 'px'; if (blockWidth >= animationWidth) { return null; } recursionAnimation() }, recurseEffectTimeOut) } recursionAnimation() setTimeout(() => { blockSelector.style.width = blockSelector.initialWidth + 'px'; blockPercent.textContent = blockPercentInit + '%'; }, toDefaultBlockTimeout) })
Спасибо!