Тёмный

Рекурсия и стек в JavaScript на примерах: factorial, fibonacci, flatten 

Елена Литвинова — Искусство Веб-разработки 🛸
Просмотров 19 тыс.
50% 1

Подробно рассмотрим работу рекурсии в JavaScript на примерах factorial, fibonacci и flatten. Расскажу про достоинства, недостатки и сложность рекурсивных функций.
🍀 Поддержать канал: www.donationalerts.com/r/webe...
☕️ Купить кофе: buy.stripe.com/5kA7sL9574SG7x...
🎨 Купить набор кистей Procreate: webelart.com/illustration.
✍️ Мой telegram channel: t.me/webelart
🏰 Английский RU-vid: @webelart_en
💁🏼‍♀️ Инстаграм: / webelart
🦄 LinkedIn: / webelart
Рекомендую посмотреть:
1. Стек и очередь в JavaScript • Учимся использовать ст...
2. Оценка сложности алгоритмов в JavaScript • Оценка сложности алгор...
00:00 введение.
00:50 factorial(n)
10:43 fibonacci(n).
16:15 достоинства и недостатки.
19:18 flatten(...)
На канале я рассматриваю различные темы веб-разработки, на текущий момент: веб-основы, веб-анимации, веб-дизайн.

Опубликовано:

 

22 июн 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 114   
@pavell53
@pavell53 2 года назад
17:48 в 20ой строке там разве не n * factorial(n-1)?
@webelart
@webelart 2 года назад
Да, всё верно, опечатка. Закрепила ваш комментарий. ❤️
@bczya1
@bczya1 3 месяца назад
Готовлюсь к собесу, повторяю теорию. Спасибо за видео!
@albertrockalfredo8250
@albertrockalfredo8250 Год назад
Thanks for подробный анализ для чайников!! Именно такие "разжеванные" ролики нужны!!!
@SM-xp8tw
@SM-xp8tw Год назад
Блин, так просто и доходчиво еще никто не объяснял рекурсии ))) Елена спасибо за годный контент
@YouMeNow88
@YouMeNow88 11 месяцев назад
Прекрасно! Где то 8-9 видео где обещают обьяснить на пальцах но стало еще больше непонятно! Само собой все замораживается а потом друг на друга умножается без какой либо логики, просто само собой. Огонь прям!
@s9219871110
@s9219871110 2 года назад
Наконец я нашел место, где объясняют все эту сложную математимщину - простым языком! Лена, спасибо!
@webelart
@webelart 2 года назад
❤️😘
@dariaryzhova1487
@dariaryzhova1487 2 года назад
Спасибо за ролик и за вашу работу! Очень понятно!
@mrbatni3522
@mrbatni3522 2 года назад
Спасибо добрый человек) до меня наконец то дошло))))
@webelart
@webelart 2 года назад
🔥🔥🔥
@squitani
@squitani 2 года назад
Отличная подача, доступное объяснение и никакого нервяка. Спасибо!
@webelart
@webelart 2 года назад
❤️
@366Din
@366Din 2 года назад
Спасибо за качественный контент! В вашем уроке гораздо больше информации, нежели на других каналах. Как правило, у всех дальше реализаций рекурсии в факториале и Фибоначчи не заходило, поэтому очень интересно было посмотреть реализацию рекурсии во flatten. Подписался на вас, буду изучать)
@Victor-il9gm
@Victor-il9gm Год назад
не останавливайте свою деятельность, Елена. спасибо!
@user-hz8yz3qg9t
@user-hz8yz3qg9t 2 года назад
Спасибо вам большое, наконец-то я понял тему. Целый день не мог понять логики, а тут ваше видео, как будто ангел с небес спустился
@user-cf8in6kr7g
@user-cf8in6kr7g 2 года назад
Супер, очень подробно, все непонятные моменты стали понятными !!! Тысячу спасибо !!!
@webelart
@webelart 2 года назад
❤️❤️❤️ Я рада!
@user-yp7yr1oo6i
@user-yp7yr1oo6i Год назад
Спасибо, у тебя крутые уроки!
@user-sm9qv2fy6l
@user-sm9qv2fy6l 8 месяцев назад
Самое комфортное объяснение. Спасибо !!!
@selivanova-a9823
@selivanova-a9823 8 месяцев назад
Спасибо вам огромное, очень полезное видео)
@user-qy9yi1kc3r
@user-qy9yi1kc3r Год назад
спасибо вам огромнейшее, наконец то теперь все стало понятно
@user-su4gw6rw2g
@user-su4gw6rw2g Год назад
очень понятно и четко объяснили спасибо большое вам
@quite10
@quite10 3 года назад
Ещё не досмотрела до конца, но уже поставила лайк❤️ У вас потрясающий контент, так хорошо объясняете, мне бы таких преподавателей, не всем дано так идеально объяснять, раскладывать всё чётко по полочкам✨ Иногда мне кажется, что это я не понимаю, но когда нахожу на вашем канале тему, которая нужна, пересматриваю и бинго всё понятно🤩 Прям радуюсь в этот момент. Спасибо Вам большое за старания, продолжайте в том же духе💘
@webelart
@webelart 3 года назад
Елизавета, спасибо большое за такой приятный и тёплый комментарий! 😌❤️
@timoha2812
@timoha2812 11 месяцев назад
Спасибо Елена! Очень просто и понятно. Лайк подписка репост ))
@escobar929
@escobar929 5 месяцев назад
Красава!!!просто умничка!!!спасибо , мил человек...
@user-ps6hu8qs8z
@user-ps6hu8qs8z Год назад
всё стало понятнее а то сидел мучался
@svetlanazheleykina4113
@svetlanazheleykina4113 Год назад
Спасибо большое! Очень интересно, подробно, познавательно! Вы вдохновляете! Пожалуйста, продолжайте. Очень хочу пересмотреть все Ваши учебные видео и продолжать смотреть в будущем. Удачи Вам во всём!
@webelart
@webelart Год назад
Спасибо Вам большое! ❤
@rostyslavkinash5232
@rostyslavkinash5232 4 месяца назад
спасибо за урок
@sfyfuture
@sfyfuture Год назад
Огромное спасибо за видео! только с ним смог понять как считается факториал все-таки
@webelart
@webelart Год назад
❤️❤️❤️
@Alextwixmen
@Alextwixmen Год назад
Музыка на фоне очень громкая, а так контент хороший. Лайк)
@razvalnuy
@razvalnuy 9 месяцев назад
Огромное спасибо, мне как раз нужно было понять как ведет себя call stack, благодаря наглядному примеру понял наконец таки !💚💚
@lvivduncan
@lvivduncan 2 года назад
спасибо!)
@KristinaShi
@KristinaShi Год назад
Спасибо❤️❤️❤️
@webelart
@webelart Год назад
😘❤❤
@user-qu5ff6dw8h
@user-qu5ff6dw8h 2 года назад
супер видео, спасибо!
@webelart
@webelart 2 года назад
❤️🤗
@user-qu5ff6dw8h
@user-qu5ff6dw8h 2 года назад
с удовольствием учусь по Вашим видео, подача информации, материал просто супер! спасибо Вам!!!!
@aleksandrkobelev8868
@aleksandrkobelev8868 Год назад
ты такая классная, очень рад, что нашел твой канал!
@webelart
@webelart Год назад
😂Спасибо! Рада, что материал нравится!!
@____Olga__
@____Olga__ 2 года назад
Елена , спасибо
@webelart
@webelart 2 года назад
@vadimsukhomlynov2551
@vadimsukhomlynov2551 Год назад
супер!!!!
@user-vi7qi9ly9r
@user-vi7qi9ly9r Год назад
thank you very much
@user-eq2eb5dk3k
@user-eq2eb5dk3k 3 месяца назад
Спасибо
@user-ox2cf4rk6l
@user-ox2cf4rk6l Год назад
thx!
@YuriiKratser
@YuriiKratser 2 года назад
Yo, это рили круто
@NikitaBELfix
@NikitaBELfix 2 года назад
Круто разрезолвлено и расказанно! Кстати, Если мы знаем, что в flatten массиве будут ТОЛЬКО числа или строки, которые можно привести к числу (5, '5' etc), то решить можно за 1 строчку кода arr.flat(Infinity).map(Number)
@user-vs3vv4dr3k
@user-vs3vv4dr3k Год назад
отличное объяснение про РЕКУРСИЮ, получше чем другие, вы объясняете что происходит, а они тупо показывают пример не разбирая процесс
@user-zt2fp3xm1p
@user-zt2fp3xm1p Год назад
СПасибо
@jamjam3337
@jamjam3337 Год назад
👏
@romannikitenko6355
@romannikitenko6355 2 года назад
The video is very interesting. But where can this technology be used in practice? Could you give some (preferably simple) examples of recursion in practice?
@ArielRaskin
@ArielRaskin 2 года назад
background music is very cool :)
@webelart
@webelart 2 года назад
❤️
@bloodbabylon8424
@bloodbabylon8424 2 года назад
Добрый день! вообще не понимаю ни чего, если последовательность фибаначчи выглядит так: 0, 1, 1, 2, 3, 5, 8, 13... Вы запрашиваете 6 число, оно выводит 8 хотя 6 число как видно 5. Так каким методом тогда при запросе вывода 5 числа из полседовательности получить вывод на экран 3? по вашей формуле 5 выводит 5. классический метод я уже пробовал ))
@youngsinatra6736
@youngsinatra6736 2 года назад
разве в flatten(...correntEl),не рест оператор используется ?Мы же вроде как собираем элементы в массив 23:04
@RuslanNumber1
@RuslanNumber1 Год назад
рест, просто автор видео попутала , скорее всего.
@user-gj9lv3ub4u
@user-gj9lv3ub4u 2 года назад
Добрый день. Интересно как можно реализовать полифил метода Flat. Я имею ввиду сделать свой метод. Через Array.prototype.
@user-yx4zt2ev2g
@user-yx4zt2ev2g 2 года назад
Елена, здравствуйте, сложновато дается понимание строки 58 в функции flatten, а именно: result.push(...flatten(...currentEl)); можно ли как-то заменить эту строку, чтобы было попроще и понятнее, сложновато немного)
@webelart
@webelart 2 года назад
Продолжай курить flatten, я в тебя верю мужик! ❤‍🔥❤‍🔥❤‍🔥
@betaveroniki8454
@betaveroniki8454 Год назад
Видео - просто супер! Только вопрос: если в console.log(flatten()); не переменные, а массив? Как измениться код?
@webelart
@webelart Год назад
Пусть это будет вашим домашним заданием. Разобраться как поменяется код.❤
@sviatbondar1721
@sviatbondar1721 Год назад
Дякую за крутезний матеріал, багато чого почерпнув для себе
@alexalwinner8890
@alexalwinner8890 2 года назад
Елена, почему в последнем примере тернарный оператор мы обернули в круглые скобки, а не в фигурные? (Array.isArray(item) ? acc.concat(flatten(...item)) : acc.concat(item))
@webelart
@webelart 2 года назад
Хороший вопрос. Смотрите, в data.reduce мы кладём функцию, функцию в JS можно создать двумя основными способами: 1. Стрелочная функция () => {...} 2. Использование слова function: function fName() {...} Плюс там всякие вариации с именованиями, анонимные и т.д. Но основное стрелочная либо использование слова function. Основное отличие в function мы можем использовать внутренний this. В стрелочной this всегда берётся извне. В текущем примере мы использовали стрелочную функцию. И у неё есть особенности. Мы можем передать фигурные скобки {}, но тогда внутри нам нужно что-то будет вернуть из функции return. Т.е. в примере можно было вызывать с фигурными {return Array.isArray(item) ?....}, но не забыть return. Либо можно использовать круглые скобки, если у нас сразу идёт возврат, нет никаких доп. переменных, рачётов. Т.е. по факту (acc, item) => (Array.isArray(item) ? ...) эквивалентна (acc, item) => {return Array.isArray(item) ? ...} Надеюсь стало понятнее. По функциям рекомендую почитать. learn.javascript.ru/function-expressions и вот эта статья по стрелочным функциям learn.javascript.ru/arrow-functions-basics
@alexalwinner8890
@alexalwinner8890 2 года назад
Елена, большое спасибо! Не догадался, что это так работает. Теперь буду знать.
@theruler8995
@theruler8995 2 года назад
что за трэк на фоне?
@WarriorExiles
@WarriorExiles Год назад
Было бы не плохо пример преобразования linkedList в array через рекурсию (пример list = { value: 1, next: { value: 2, next: null})
@webelart
@webelart Год назад
Преобразования во что? Обход списка? У меня есть про деревья: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-loLjdVaaDKs.html и обход дерева в том числе.
@sh0ny
@sh0ny Год назад
"Как мы помним со школы" нифига не помним 🤣
@sohibusmonov9030
@sohibusmonov9030 2 года назад
если факториал меньше 0 то есть минусовое число то не выгодно ли проверить его умножить на -1))
@zurkevich
@zurkevich Год назад
Елена, некоторые понятия объяснены не правильно, так длина стека не определяется количеством вызовов, в данном случае ограничением является объём выделенной под стек памяти. Таким образом функции, принимающие большее количество параметров, достигнут предела по стеку раньше чем функции с меньшим количеством параметров. Когда выполняется тело функции, то все параметры использованные при её вызове уже хранятся в стеке. Это не происходит в момент вызова подфункции.
@voytko1994
@voytko1994 Год назад
22:10 почему result.push(...) зачем спредить функцию, хотя проверил у себя - работает P.S. Почему внутри, во flatten кидаем спред - я понимаю
@fedc_
@fedc_ 2 года назад
Вроде все рассказали и про глубину и про О, но как просиходят сами вычисления в фибоначчи так и не понял
@webelart
@webelart 2 года назад
Расскажите подробнее. Формула не понятна? Или, может, как код работает?
@fedc_
@fedc_ 2 года назад
@@webelart логика вычислений и что вообще считаем ) Я так понял вы считаете сумму чисел в последовательности Фибоначчи до числа n ? Тогда не понял именно 2 рекурсивных вызова n - 1 и n - 2 . Я понимаю что я где то в логике ошибаюсь и не до конца понимаю. Например нам нужно сложить все числа Фибоначчи до 6, это будет 0+1+1+2+3+5 =12. А вот как здесь n-1 + n-2 работают я не понял n-1 = 5 n-2=4. Ну и эм... Все мои мысли зашли в тупик . Я не понял почему мы каждое значение берём от 0 до n, когда например 4 в эту последовательность не входит . В общем где то я что то упустил , но не понимаю что(((
@fedc_
@fedc_ 2 года назад
@@webelart факториал в целом сразу понял
@webelart
@webelart 2 года назад
@@fedc_ Я чуть попозже отвечу. Поняла проблему.
@webelart
@webelart 2 года назад
​@@fedc_ Нет в функции Фибоначчи считается не сумма до числа n. Смотрите, последовательность Фибоначчи представляет собой набор цифр: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, Т.е. это по факту бесконечная последовательность. Каждая следующая цифра является суммой двух предыдущих. В функции fibonacci(n) находится значение, которое присуще n-ой позиции. Например, fibonacci(7) = 13, fibonacci(6) = 8, т.е. n - это как бы индекс в последовательности Фибоначчи: 0,1,2,3,4,5,6,7 и т.д. И собственно чтобы получить число более глубокое чем 1 нужно взять два предыдущих числа n - 1 и n - 2 и сложить их. Есть прояснения?
@azimut9652
@azimut9652 Год назад
Рекурсия простыми словами. Начнём с факторами 😂😂😂😂😂
@webelart
@webelart Год назад
😂 я полагаю все знают что такое факториал, мне кажется последовательность Фибоначчи круче.
@azimut9652
@azimut9652 Год назад
@@webelart Последовательность Фибоначчи - число равно сумме двух предыдущих. Коротко и ясно . В эту игру можно играть вдвоём . То - есть может быть и 0, -1, -1, -2 и так далее .
@sohibusmonov9030
@sohibusmonov9030 2 года назад
если можно без музыки
@alenachuyankova
@alenachuyankova 2 года назад
Пытаюсь во фронт, рекурсия - моя боль.
@antoncigur2724
@antoncigur2724 2 года назад
Почему это вообще циклится?
@webelart
@webelart 2 года назад
Про рекурсию? Смотри допустим ты компилятор и вызываешь код, ты вызываешь функцию и выполняешь её. А внутри вновь её вызываешь, т.е. опять заходишь в функцию и выполняешь ещё и в ней ещё раз вызываешь, так можно зациклиться до бесконечности, если не сделать остановку. Если попробовать из примера в жизни, даже не знаю что такого придумать, допустим ты входишь в комнату и в этой комнате есть дверь, в которая ведёт в туже самую комнату. В реальности такого не встретишь, здесь надо просто представить. Можно сравнить вход в комнату с вызовом функции одной и той же. Но чтобы это не повторялось бесконечно, устанавливаются условия и в комнату ты входишь с новым набором переменных. Кстати в жизни такие зацикливания я ещё сравнивала с отражениями зеркал, когда с спереди и сзади есть зеркало и ты начинаешь повторяться бесконечное число раз.
@antoncigur2724
@antoncigur2724 2 года назад
@@webelart спасибо что ответили. Все равно это очень сложно, запутанно. Очень сложно собрать «конструкцию» в голове.
@antoncigur2724
@antoncigur2724 2 года назад
@@webelart не знаю кем вы работаете, наверное программистом. Часто приходится пользоваться рекурсиями ? А так, у вас лучшее объяснение рекурсии
@webelart
@webelart 2 года назад
@@antoncigur2724 Да, рекурсию не так просто переварить. Здесь если разбираться рекомендую изучить дать себе время и порешать задачки, например на www.codewars.com. Дать мозгу осознать и привыкнуть. Да, я программист, по факту веб-разработчик. :) Спасибо, я рада, что контент зашёл!
@antoncigur2724
@antoncigur2724 2 года назад
@@webelart в веб много пользуетесь рекурсией?
@RuslanNumber1
@RuslanNumber1 Год назад
Случайно сюда зашел и как по мне, автор видео очень плохо объясняет, особенно в конце с flatten. Когда автор видео что-то объясняет - вспоминаю универ, где все также на словах в уши заливал препод, а на деле ничего непонятно, только если самому код разбирать и вникать. Просто какой-то сумбур из уст, несмотря на то, что в коде все более менее ок. Поток мыслей бежит, ну учить объяснять совсем у девушки не выходит. 23:06 - используется фраза "используется spread оператор, чтобы собрать массивчик?" Spread оператор расскладывает массив на элементы, а не собирает, а функция уже возвращает массив result. Оператор spread не используется для того, чтобы собрать массивчик, это не правильная интерпретация автора. В функцию мы передает с помощью оператора ...rest все элементы в виде массива (он же ...data).
@webelart
@webelart Год назад
А вы я вижу являетесь дискриминатором, вас так штормануло, что девушка преподаёт крутой контент? Объяснение отличное, если у вас там что-то чешется в штанах, возьмите и почешите. А сюда люди приходят учиться и усваивать информацию, если что-то не понятно - вопрос. Обесценивание контента - это самое низкое, что обычно делают люди с весьма низкой самооценкой пытался выстроить себя за счет других. Не на этом канале мен.👁
@webelart
@webelart Год назад
И да, будете писать всякую херню заблочу! И учтите я одна из немногих на ютубе, кто помогает и отвечает на вопросы своих подписчиков. 😘
@RuslanNumber1
@RuslanNumber1 Год назад
@@webelart я не пытался обидеть, это просто мое мнение, никого я не пытался там выстроить и т.д.. Мне просто не очень понравилось как преподнесен был материал. Да, я провел аналогию со схожим преподаванием в универах: где много слов, а толку мало. В принципе, вам, как автору обучающего контента, вполне по барабану кому и что там не понравилось, но как по мне - повод задуматься о качестве преподавания, чтобы его улучшать и не терять подписчиков, т.к. если бы мне объяснение материала показалось более качественным/понятным, то я бы подписался. Мне, честно, не особо-то интересно, заблочите вы меня или нет, т.к. я , повторюсь, случайно сюда зашел , а список своих каналов по разработке держу в подписке. Желаю удачи в этом нелегком деле и желаю только расти в этом.
@webelart
@webelart Год назад
@@RuslanNumber1 Это вообще как не обидеть обозвав мой контент, вы с людьми также на улице разговариваете при знакомстве? Мне не очень нравится как вы выглядите уж простите. Вы же понимаете, что каждый человек уникальный, как целая вселенная. Каждый преподносит свой материал по своему. И вы я уверена, если будете делать рассказ, найдется куча людей которым не понравится. Дополнить материал - это нормально, я всегда слушаю своих подписчиков, но обесценивать, вообще не разу не позволю. И работа любого преподавателя, донести как он может. А ваша задача задать вопросы, чтобы коннект случился. У каждого разный опыт, и здесь 50 на 50, первая половина преподаватель, вторая половина ваша усвоить. А не так что преподаватель делает 100 % угадывая ваши ожидания. Запомните мир так не работает вообще! Желаю вам удачи в освоении рекурсии 😘 Если надо спрашивайте вопросы, но без этого, мне не нравится. 😬
@webelart
@webelart Год назад
@@RuslanNumber1 И кстати, да, я не чувствую никакой обиды, я в своем материале уверена на 200%. По мне так просто пришел чувак со своей агрессией, видимо не с той ноги сегодня встал. Ну я вам ее и возвращаю, зачем она мне ваша агрессия, живите с ней сами.
@dogvscatfunny9956
@dogvscatfunny9956 6 месяцев назад
Вот это ерунда, так что можно понять из такого глупого объяснения это жесть
@webelart
@webelart 4 месяца назад
И в чем же оно глупое?
@dogvscatfunny9956
@dogvscatfunny9956 4 месяца назад
@@webelart В том что из вашего объяснения не чего не понятно.
Далее
HEIGHT KICK CHALLENGE 📏🙈
00:20
Просмотров 7 млн