Когда следует использовать рекурсию в javascript?

На данной странице будет рассмотрен частный случай использования рекурсии на примере вложенности массивов в другие массивы, т.е. многомерного массива если можно так выразиться:

далее идёт массив, над которым будут проводиться данные эксперименты.

let composers = [
    'Массив с композиторами и их произведениями!'
    , ['Во́льфганг Амаде́й Мо́царт'
        , ['Missa brevis in G'
            , 'Missa brevis ре минор'
            , 'Litaniae Lauretanae B.M.V. in D'
        ]
    ]
    , ['Пётр Ильич Чайковский'
        , ['Лебединое озеро'
            , 'Спящая красавица'
            , 'Щелкунчик', 'Ундина'
        ]
    ]
    , ['Иоганн Себастьян Бах'
        , ['Страсти по Матфею'
            , 'Месса си минор'
            , 'Бранденбургские концерты'
        ]
    ]
]; 

Для эксперимента создан массив с несколькоми композиторами: нулевой элемент является строкой, элементы с 1-го по 3-го являются также массивами.

Для начала выведем все элементы массива с помощью циклов for:

for (let i = 0, j = composers.length; i < j; i++) {
    if (Array.isArray(composers[i]) === true) {
        for (let k = 0, z = composers[i].length; k < z; k++) {
            if (Array.isArray(composers[i][k]) === true) {
                for (let d = 0, e = composers[i][k].length; d < e; d++) {
                    console.log(composers[i][k][d]);
                }
            } else {
                console.log(composers[i][k]);
            }
        }
    } else {
        console.log(composers[i]);
    }
}
 

Первый цикл for - строка 24 выводит только нулевой элемент, который является строкой. Второй цикл for - строка 26 выводит ФИО композитора. Третий цикл for - строка 28 выводит произведения данных композиторов.

Проблема заключается в том, что можно спроектировать циклы если известно количество вложенных массивов. Заметьте, в третьем цикле for уже не была заложенна проверка на следующий вложенный массив. Чем больше вложенных массивов, тем более громоздким будет код!!!

Решение есть - рекурсия!!!

Для того чтобы обойти массив и вывести все его элементы на экран будет использована пользовательская рекурсивная функция. Рекурсивная функция будет вызывать сама себя в том случае, если элементом массива будет тоже некий массив, пример:

function getComposers1(userArray) {

    for (let i = 0; i < userArray.length; i++) {
        if (Array.isArray(userArray[i]) === true) {
            getComposers1(userArray[i]);
        } else {
            console.log(userArray[i]);
        }
    }
}

getComposers1(composers);
 

На строках с 42 по 51 декларирована функция getComposers1, обратите внимание на то, что в 46-й строке функция getComposers1 вызывает сама себя  - это и есть рекурсия!

getComposers1 внутри себя вызывает саму себя по условию, в котором проверяется является ли элемент массивом. А проверяется с помощью встроенной функии  Array.isArray(), которая возвращает true если передаётся массив и false - если не массив.

И на 53-й строке и вызывается функция getComposers1.

Теперь усложним функцию, и добавим флаг, если флаг будет равен true - то будут выводиться все элементы массива со всеми вложенными элементами массивов, если флаг будет равен false - то будут выводиться элементы которые не будут являться массивами:

function getComposers2(userArray, flag) {
    for (let i = 0, j = userArray.length; i < j; i++) {

        if (Array.isArray(userArray[i]) === true) {
            if (flag === true)
                getComposers2(userArray[i], flag);
        } else {
            console.log(userArray[i]);
        }
    }
}
 

смотрим первый результат выполнения:

в данном случае параметр flag=true, поэтому результат не будет отличаться от предудущего.

Теперь меняем на flag= false:

В результате функция вывела только те элементы, которые не являются массивами!

Скачать скрипты в архиве