Пояснение, как работает Rectangle Recursion JavaScript

Question

Я новичок в мире кода. У меня проблемы с пониманием рекурсии в JavaScript, особенно когда он требует двух или более циклов. Как я хочу напечатать прямоугольник, используя рекурсию. Я не знаю полностью, как сделать базовый случай, условие, когда оно все еще выполняется. Например, эти коды ниже я использую для печати прямоугольника или прямоугольника дырки.

function box(num) {
  for (let i = 0; i < num; i++) {
    let str = ''
    for (let j = 0; j < num; j++) {
      str += '*'
    }
    console.log(str)
  }
}

box(5)


function holeBox (num) {
   for(let i = 0; i < num; i++){
    let str = ''
     for(let j = 0; j < num; j++){
        if(i == 0 || i == num -1 || j == 0 || j == num - 1) {
          str += '*'
        } else {
           str += ' '
        }
     }
     console.log(str)
   }
}

holeBox (5)

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

Answer 1

Да, даже код вашего ящика можно превратить в рекурсию, но я не думаю, что это поможет вам понять концепцию рекурсии.

Если вам действительно нужно:

function getBox(arr, size) {
    let length = arr.length;
    if (length == size)
        return arr; // recursion stop rule - if the size reached
    for (let i = 0; i < length; i++)
        arr[i].push("*"); // fill new size for all row
    arr.push(new Array(length + 1).fill("*")); // add new row
    return getBox(arr, size); // recursive call with arr bigger in 1 row
}

Тем не менее, я считаю, что ответ @Gumbo лучше объяснит концепцию, чем эта ...

Answer 2

Чтобы понять, как работает рекурсия, просто подумайте, как можно разделить то, что вы хотите выполнить, на более мелкие задачи, и как функция может выполнить одну из этих задач, а затем вызывать себя для выполнения следующей - и так далее, пока это закончено. Лично я не считаю печать ящиков лучшим способом изучения рекурсии, поэтому представьте, что вы хотите найти в массиве конкретное значение; пока игнорируйте JavaScript indexOf()/find() функции или похожие.

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

//Returns the index of the first occurrence of a value in an array, or -1 if nothing is found
function search(needle, haystack) {
    for (let i = 0; i < haystack.length; i++) {
        if (haystack[i] == needle) return i;
    }
    return -1;
}

Сделать это с помощью рекурсии также легко:

function recursiveSearch(needle, haystack, i) {
    if (i > (haystack.length - 1)) return -1; //check if we are at the end of the array
    if (haystack[i] == needle) return i; //check if we've found what we're looking for

    //if we haven't found the value yet and we're not at the end of the array, call this function to look at the next element
    return recursiveSearch(needle, haystack, i + 1);
}

Эти функции делают одно и то же, просто по-разному. В рекурсивной функции два оператора if являются базовыми. Функция:

1. Проверяет, находится ли текущий элемент за пределами массива (имеется в виду, что мы уже искали каждый элемент), и если да, возвращает -1
2. Проверяет, является ли текущий элемент тем, что мы ищем, и если да, возвращает индекс
3. Если ни одно из приведенных выше утверждений не применимо, мы вызываем эту функцию рекурсивно, чтобы проверить следующий элемент
4. Повторяйте это до тех пор, пока не сработает один из базовых вариантов.

Обратите внимание, что рекурсивные функции обычно вызываются из других вспомогательных функций, поэтому вам не нужно передавать начальные параметры для вызова функции. Например, приведенная выше функция recursiveSearch() будет закрытой и будет вызываться другой функцией, подобной этой:

function search(needle, haystack) {
    return recursiveSearch(needle, haystack, 0);
}

чтобы нам не приходилось включать третий параметр при вызове, что уменьшает путаницу.