재귀란 무엇입니까? 자바스크립트의 재귀에 대한 자세한 설명

이 글의 내용은 재귀란 무엇일까요? JavaScript의 재귀에 대한 자세한 설명은 참고할만한 가치가 있습니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1. 재귀란 무엇인가요?

재귀의 개념은 매우 간단합니다. "자신을 호출하세요"(아래 함수를 예로 들어 보겠습니다).

재귀를 분석하기 전에 JavaScript의 "콜 스택" 개념을 이해해야 합니다.

2. 스택 밀기 및 터뜨리기

스택이란 무엇인가요? 이는 메모리의 특정 영역이라고 이해할 수 있습니다. 이 영역은 상자에 무언가를 넣으면 스택이 푸시됩니다. 따라서 가장 먼저 내려놓을 것은 상자 바닥에 있고, 마지막으로 내려놓을 것은 상자 상단에 있습니다. 상자에서 무언가를 꺼내는 것은 그것을 스택 밖으로 밀어내는 것으로 이해될 수 있습니다.

그래서 우리는 물건을 위에서 아래로 가져가는 습관이 있다는 결론에 도달했습니다. 가장 먼저 내려놓는 것은 상자 맨 아래에 있고 마지막으로 가져오는 것은 물건입니다.

JavaScript에서는 함수가 호출되면 스택 푸시가 발생합니다. Pop은 return 키워드가 포함된 문장을 만나거나 실행이 종료될 때만 발생합니다.

예제를 살펴보겠습니다. 이 코드의 실행 순서는 무엇인가요?

function fn1() {
    return 'this is fn1'
}

function fn2() {
    fn3()
    return 'this is fn2'
}

function fn3() {
    let arr = ['apple', 'banana', 'orange']
    return arr.length
}

function fn() {
    fn1()
    fn2()
    console.log('All fn are done')
}

fn()

위에서 일련의 스택 푸시 및 팝핑 동작이 발생했습니다.

1. 먼저 스택(상자)이 처음에는 비어 있습니다.

2. 함수 fn이 실행되고, fn이 먼저 스택에 푸시되고 위치에 배치됩니다. 하단

3. 함수 fn1이 먼저 실행되고, fn1이 fn 위의 스택에 푸시됩니다.

4. 함수 fn1이 실행되고, return 키워드를 만나면 fn1이 스택에서 팝됩니다. 이제 fn

5만 있습니다. fn1이 실행된 후 함수 fn2가 실행되기 시작하고 fn2가 스택에 푸시됩니다. fn3이 발생하면 fn3이 실행되기 시작하므로 fn3이 스택에 푸시됩니다

6. 이때 스택은 아래에서 위로 순서는 다음과 같습니다. fn3

7. 비유하자면 함수 fn3 내에서 return 키워드가 있는 문장을 만나면 fn3은 실행 후 스택에서 튀어나와 함수로 돌아갑니다. fn2도 return 키워드를 만나 계속해서 팝됩니다. 스택.

8. 이제 스택에는 fn만 있습니다. console.log('All fn are done') 문을 실행한 후 fn이 스택에서 나옵니다.

9. 이제 스택이 다시 비어 있습니다. 위의 단계는 사람들을 혼동하기 쉽습니다. 흐름도는 다음과 같습니다

간단한 JavaScript 재귀를 먼저 살펴보세요

function sumRange(num) {
  if (num === 1) return 1;
  return num + sumRange(num - 1)
}

sumRange(3) // 6

위 코드 실행 순서:

1. 함수 sumRange(3)가 실행되고 sumRange(3)가 스택에 푸시되고 return 키워드가 발견되지만 이를 수행할 수 없습니다. (num - 1)은 sumRange(2)

2이기 때문에 스택에서 즉시 팝됩니다. 따라서 sumRange(2)가 스택으로 푸시되고, sumRange(1)도 스택으로 푸시됩니다. stack,

3. 마지막으로 sumRange(1)은 스택에서 팝되고 1을 반환하고, sumRange(2)는 스택을 팝하고, 2를 반환하고, sumRange(3)는

4를 반환하므로 결과는 3 + 2 + 1입니다. 6

흐름도를 보세요

그래서 재귀도 푸시 앤 팝 프로세스입니다.

재귀는 비재귀적이라고 표현할 수 있습니다. 다음은 위의 재귀적 예시와 동일한 실행입니다

// for 循环
function multiple(num) {
    let total = 1;
    for (let i = num; i > 1; i--) {
        total *= i
    }
    return total
}
multiple(3)

4. 재귀에 대한 참고 사항

위 예시를 수정하면 다음과 같습니다.

function multiple(num) {
    if (num === 1) console.log(1)
    return num * multiple(num - 1)
}

multiple(3) // Error: Maximum call stack size exceeded

위 코드 문장의 첫 번째 줄에는 return 키워드가 없습니다. 재귀에 대한 종료 조건이 없기 때문에 항상 스택에 푸시되어 메모리 누수가 발생합니다.

재귀는 오류가 발생하기 쉽습니다

종료 지점이 설정되지 않았습니다

재귀 외에도 코드의 다른 부분

재귀가 적합한 경우

좋아요, 위는 JavaScript의 재귀 개념.

다음은 연습문제입니다.

6. 연습 문제

1. 1. 문자열을 받아 원래 문자열의 반대인 문자열을 반환하는 함수를 작성하세요.
   2. 문자열을 받아 앞부터 뒤까지 한 문자를 비교하는 함수를 작성하세요. 두 문자가 같으면 true를 반환하고, false를 반환합니다.
2. 3. 배열을 받아들이고 평면화된 새 배열을 반환하는 함수를 작성하세요.
   4. 객체 값이 짝수인 경우 이를 더해 총 값을 반환하는 함수를 작성하세요.
3. 5. 객체를 받아 배열을 반환하는 함수를 작성하세요. 이 배열에는 문자열

7인 객체의 모든 값이 포함됩니다. 참고문헌 3

function reverse(str) {
   if(str.length <p>참고문헌 4</p><pre class="brush:php;toolbar:false">function isPalindrome(str){ 
    if(str.length === 1) return true;
    if(str.length === 2) return str[0] === str[1]; 
    if(str[0] === str.slice(-1)) return isPalindrome(str.slice(1,-1)) 
    return false; 
}
var str = 'abba'
isPalindrome(str)

참고문헌 5

function flatten (oldArr) {
   var newArr = [] 
   for(var i = 0; i <p><strong>5. 요약</strong></p><p>재귀의 본질은 정규 부분을 먼저 생각해야 한다는 것입니다. 재귀 부분을 고려할 때 JavaScript 재귀에서 일반적으로 사용되는 방법은 다음과 같습니다.</p><p>Array: Slice, concat</p><p>String: Slice, substr, substring </p><p>객체: Object.Assign</p>

위 내용은 재귀란 무엇입니까? 자바스크립트의 재귀에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!