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

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

Пікірлер: 114

  • @pavell53
    @pavell532 жыл бұрын

    17:48 в 20ой строке там разве не n * factorial(n-1)?

  • @webelart

    @webelart

    2 жыл бұрын

    Да, всё верно, опечатка. Закрепила ваш комментарий. ❤️

  • @bczya1
    @bczya12 ай бұрын

    Готовлюсь к собесу, повторяю теорию. Спасибо за видео!

  • @YouMeNow88
    @YouMeNow8810 ай бұрын

    Прекрасно! Где то 8-9 видео где обещают обьяснить на пальцах но стало еще больше непонятно! Само собой все замораживается а потом друг на друга умножается без какой либо логики, просто само собой. Огонь прям!

  • @albertrockalfredo8250
    @albertrockalfredo8250 Жыл бұрын

    Thanks for подробный анализ для чайников!! Именно такие "разжеванные" ролики нужны!!!

  • @Victor-il9gm
    @Victor-il9gm Жыл бұрын

    не останавливайте свою деятельность, Елена. спасибо!

  • @dariaryzhova1487
    @dariaryzhova1487 Жыл бұрын

    Спасибо за ролик и за вашу работу! Очень понятно!

  • @SM-xp8tw
    @SM-xp8tw Жыл бұрын

    Блин, так просто и доходчиво еще никто не объяснял рекурсии ))) Елена спасибо за годный контент

  • @mrbatni3522
    @mrbatni35222 жыл бұрын

    Спасибо добрый человек) до меня наконец то дошло))))

  • @webelart

    @webelart

    2 жыл бұрын

    🔥🔥🔥

  • @s9219871110
    @s92198711102 жыл бұрын

    Наконец я нашел место, где объясняют все эту сложную математимщину - простым языком! Лена, спасибо!

  • @webelart

    @webelart

    2 жыл бұрын

    ❤️😘

  • @squitani
    @squitani2 жыл бұрын

    Отличная подача, доступное объяснение и никакого нервяка. Спасибо!

  • @webelart

    @webelart

    2 жыл бұрын

    ❤️

  • @366Din
    @366Din2 жыл бұрын

    Спасибо за качественный контент! В вашем уроке гораздо больше информации, нежели на других каналах. Как правило, у всех дальше реализаций рекурсии в факториале и Фибоначчи не заходило, поэтому очень интересно было посмотреть реализацию рекурсии во flatten. Подписался на вас, буду изучать)

  • @user-cf8in6kr7g
    @user-cf8in6kr7g2 жыл бұрын

    Супер, очень подробно, все непонятные моменты стали понятными !!! Тысячу спасибо !!!

  • @webelart

    @webelart

    2 жыл бұрын

    ❤️❤️❤️ Я рада!

  • @selivanova-a9823
    @selivanova-a98237 ай бұрын

    Спасибо вам огромное, очень полезное видео)

  • @user-hz8yz3qg9t
    @user-hz8yz3qg9t2 жыл бұрын

    Спасибо вам большое, наконец-то я понял тему. Целый день не мог понять логики, а тут ваше видео, как будто ангел с небес спустился

  • @user-yp7yr1oo6i
    @user-yp7yr1oo6i Жыл бұрын

    Спасибо, у тебя крутые уроки!

  • @svetlanazheleykina4113
    @svetlanazheleykina4113 Жыл бұрын

    Спасибо большое! Очень интересно, подробно, познавательно! Вы вдохновляете! Пожалуйста, продолжайте. Очень хочу пересмотреть все Ваши учебные видео и продолжать смотреть в будущем. Удачи Вам во всём!

  • @webelart

    @webelart

    Жыл бұрын

    Спасибо Вам большое! ❤

  • @user-sm9qv2fy6l
    @user-sm9qv2fy6l7 ай бұрын

    Самое комфортное объяснение. Спасибо !!!

  • @user-qy9yi1kc3r
    @user-qy9yi1kc3r Жыл бұрын

    спасибо вам огромнейшее, наконец то теперь все стало понятно

  • @user-su4gw6rw2g
    @user-su4gw6rw2g Жыл бұрын

    очень понятно и четко объяснили спасибо большое вам

  • @timoha2812
    @timoha281210 ай бұрын

    Спасибо Елена! Очень просто и понятно. Лайк подписка репост ))

  • @sfyfuture
    @sfyfuture Жыл бұрын

    Огромное спасибо за видео! только с ним смог понять как считается факториал все-таки

  • @webelart

    @webelart

    Жыл бұрын

    ❤️❤️❤️

  • @rostyslavkinash5232
    @rostyslavkinash52323 ай бұрын

    спасибо за урок

  • @quite10
    @quite102 жыл бұрын

    Ещё не досмотрела до конца, но уже поставила лайк❤️ У вас потрясающий контент, так хорошо объясняете, мне бы таких преподавателей, не всем дано так идеально объяснять, раскладывать всё чётко по полочкам✨ Иногда мне кажется, что это я не понимаю, но когда нахожу на вашем канале тему, которая нужна, пересматриваю и бинго всё понятно🤩 Прям радуюсь в этот момент. Спасибо Вам большое за старания, продолжайте в том же духе💘

  • @webelart

    @webelart

    2 жыл бұрын

    Елизавета, спасибо большое за такой приятный и тёплый комментарий! 😌❤️

  • @razvalnuy
    @razvalnuy8 ай бұрын

    Огромное спасибо, мне как раз нужно было понять как ведет себя call stack, благодаря наглядному примеру понял наконец таки !💚💚

  • @aleksandrkobelev8868
    @aleksandrkobelev8868 Жыл бұрын

    ты такая классная, очень рад, что нашел твой канал!

  • @webelart

    @webelart

    Жыл бұрын

    😂Спасибо! Рада, что материал нравится!!

  • @escobar929
    @escobar9294 ай бұрын

    Красава!!!просто умничка!!!спасибо , мил человек...

  • @user-qu5ff6dw8h
    @user-qu5ff6dw8h2 жыл бұрын

    супер видео, спасибо!

  • @webelart

    @webelart

    2 жыл бұрын

    ❤️🤗

  • @user-qu5ff6dw8h

    @user-qu5ff6dw8h

    2 жыл бұрын

    с удовольствием учусь по Вашим видео, подача информации, материал просто супер! спасибо Вам!!!!

  • @____Olga__
    @____Olga__2 жыл бұрын

    Елена , спасибо

  • @webelart

    @webelart

    2 жыл бұрын

  • @lvivduncan
    @lvivduncan2 жыл бұрын

    спасибо!)

  • @user-ps6hu8qs8z
    @user-ps6hu8qs8z Жыл бұрын

    всё стало понятнее а то сидел мучался

  • @NikitaBELfix
    @NikitaBELfix2 жыл бұрын

    Круто разрезолвлено и расказанно! Кстати, Если мы знаем, что в flatten массиве будут ТОЛЬКО числа или строки, которые можно привести к числу (5, '5' etc), то решить можно за 1 строчку кода arr.flat(Infinity).map(Number)

  • @user-vi7qi9ly9r
    @user-vi7qi9ly9r Жыл бұрын

    thank you very much

  • @KristinaShi
    @KristinaShi Жыл бұрын

    Спасибо❤️❤️❤️

  • @webelart

    @webelart

    Жыл бұрын

    😘❤❤

  • @vadimsukhomlynov2551
    @vadimsukhomlynov255111 ай бұрын

    супер!!!!

  • @user-eq2eb5dk3k
    @user-eq2eb5dk3k2 ай бұрын

    Спасибо

  • @romannikitenko6355
    @romannikitenko63552 жыл бұрын

    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?

  • @Alextwixmen
    @Alextwixmen Жыл бұрын

    Музыка на фоне очень громкая, а так контент хороший. Лайк)

  • @user-ox2cf4rk6l
    @user-ox2cf4rk6l Жыл бұрын

    thx!

  • @YuriiKratser
    @YuriiKratser2 жыл бұрын

    Yo, это рили круто

  • @user-vs3vv4dr3k
    @user-vs3vv4dr3k Жыл бұрын

    отличное объяснение про РЕКУРСИЮ, получше чем другие, вы объясняете что происходит, а они тупо показывают пример не разбирая процесс

  • @user-gj9lv3ub4u
    @user-gj9lv3ub4u2 жыл бұрын

    Добрый день. Интересно как можно реализовать полифил метода Flat. Я имею ввиду сделать свой метод. Через Array.prototype.

  • @user-zt2fp3xm1p
    @user-zt2fp3xm1p Жыл бұрын

    СПасибо

  • @ArielRaskin
    @ArielRaskin2 жыл бұрын

    background music is very cool :)

  • @webelart

    @webelart

    2 жыл бұрын

    ❤️

  • @bloodbabylon8424
    @bloodbabylon84242 жыл бұрын

    Добрый день! вообще не понимаю ни чего, если последовательность фибаначчи выглядит так: 0, 1, 1, 2, 3, 5, 8, 13... Вы запрашиваете 6 число, оно выводит 8 хотя 6 число как видно 5. Так каким методом тогда при запросе вывода 5 числа из полседовательности получить вывод на экран 3? по вашей формуле 5 выводит 5. классический метод я уже пробовал ))

  • @betaveroniki8454
    @betaveroniki8454 Жыл бұрын

    Видео - просто супер! Только вопрос: если в console.log(flatten()); не переменные, а массив? Как измениться код?

  • @webelart

    @webelart

    Жыл бұрын

    Пусть это будет вашим домашним заданием. Разобраться как поменяется код.❤

  • @alexalwinner8890
    @alexalwinner88902 жыл бұрын

    Елена, почему в последнем примере тернарный оператор мы обернули в круглые скобки, а не в фигурные? (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 жыл бұрын

    Елена, большое спасибо! Не догадался, что это так работает. Теперь буду знать.

  • @user-yx4zt2ev2g
    @user-yx4zt2ev2g Жыл бұрын

    Елена, здравствуйте, сложновато дается понимание строки 58 в функции flatten, а именно: result.push(...flatten(...currentEl)); можно ли как-то заменить эту строку, чтобы было попроще и понятнее, сложновато немного)

  • @webelart

    @webelart

    Жыл бұрын

    Продолжай курить flatten, я в тебя верю мужик! ❤‍🔥❤‍🔥❤‍🔥

  • @youngsinatra6736
    @youngsinatra6736 Жыл бұрын

    разве в flatten(...correntEl),не рест оператор используется ?Мы же вроде как собираем элементы в массив 23:04

  • @RuslanNumber1

    @RuslanNumber1

    Жыл бұрын

    рест, просто автор видео попутала , скорее всего.

  • @jamjam3337
    @jamjam3337 Жыл бұрын

    👏

  • @WarriorExiles
    @WarriorExiles Жыл бұрын

    Было бы не плохо пример преобразования linkedList в array через рекурсию (пример list = { value: 1, next: { value: 2, next: null})

  • @webelart

    @webelart

    Жыл бұрын

    Преобразования во что? Обход списка? У меня есть про деревья: kzread.info/dash/bejne/nqOAzMaPkcSqe9Y.html и обход дерева в том числе.

  • @theruler8995
    @theruler89952 жыл бұрын

    что за трэк на фоне?

  • @sohibusmonov9030
    @sohibusmonov90302 жыл бұрын

    если факториал меньше 0 то есть минусовое число то не выгодно ли проверить его умножить на -1))

  • @sh0ny
    @sh0ny Жыл бұрын

    "Как мы помним со школы" нифига не помним 🤣

  • @voytko1994
    @voytko1994 Жыл бұрын

    22:10 почему result.push(...) зачем спредить функцию, хотя проверил у себя - работает P.S. Почему внутри, во flatten кидаем спред - я понимаю

  • @zurkevich
    @zurkevich Жыл бұрын

    Елена, некоторые понятия объяснены не правильно, так длина стека не определяется количеством вызовов, в данном случае ограничением является объём выделенной под стек памяти. Таким образом функции, принимающие большее количество параметров, достигнут предела по стеку раньше чем функции с меньшим количеством параметров. Когда выполняется тело функции, то все параметры использованные при её вызове уже хранятся в стеке. Это не происходит в момент вызова подфункции.

  • @sviatbondar1721
    @sviatbondar1721 Жыл бұрын

    Дякую за крутезний матеріал, багато чого почерпнув для себе

  • @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
    @sohibusmonov90302 жыл бұрын

    если можно без музыки

  • @alenachuyankova
    @alenachuyankova2 жыл бұрын

    Пытаюсь во фронт, рекурсия - моя боль.

  • @antoncigur2724
    @antoncigur27242 жыл бұрын

    Почему это вообще циклится?

  • @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
    @dogvscatfunny99565 ай бұрын

    Вот это ерунда, так что можно понять из такого глупого объяснения это жесть

  • @webelart

    @webelart

    3 ай бұрын

    И в чем же оно глупое?

  • @dogvscatfunny9956

    @dogvscatfunny9956

    3 ай бұрын

    @@webelart В том что из вашего объяснения не чего не понятно.

Келесі