Bagaimana untuk memahami rekursi dalam JavaScript?-tutorial js-php.cn

Bagaimana untuk memahami rekursi dalam JavaScript?

PHPz

Lepaskan： 2023-08-29 19:25:07

ke hadapan

666 orang telah melayarinya

如何理解 JavaScript 中的递归？

Apakah rekursi?

Perkataan rekursi berasal daripada berulang, yang bermaksud kembali ke masa lalu lagi dan lagi. Fungsi rekursif ialah fungsi yang memanggil dirinya lagi dan lagi dengan menukar input langkah demi langkah. Di sini, menukar input dengan satu tahap bermakna mengurangkan atau meningkatkan input dengan satu tahap.

Setiap kali fungsi rekursif mencapai keadaan asas, ia menghentikan pelaksanaannya sendiri. Marilah kita memahami apakah syarat asas melalui contoh. Sebagai contoh, kita perlu mencari faktorial bagi suatu nombor. Kami memanggil fungsi faktorial dengan mengurangkan input sebanyak 1 dan perlu berhenti apabila input mencapai 1. Oleh itu, di sini 1 berfungsi sebagai syarat asas.

tatabahasa

Pengguna boleh menggunakan sintaks berikut untuk memahami rekursi dalam JavaScript.

function recur(val) {
   if (base condition) {
      return;
   }
   
   // perform some action
   
   // decrease the value of val by one step
   return recur(newVal);
}

Salin selepas log masuk

Dalam sintaks di atas, pengguna boleh memerhatikan bahawa apabila keadaan asas menjadi benar, kami mengembalikan null untuk menghentikan pelaksanaan fungsi. Jika keadaan asas adalah palsu, kami melakukan beberapa tindakan dengan nilai input dan memanggil fungsi recur() sekali lagi dengan nilai parameter baharu.

Sekarang, mari kita lihat pelbagai contoh rekursi. Di sini kita akan belajar untuk terlebih dahulu melaksanakan algoritma lelaran menggunakan gelung for dan kemudian menukarnya kepada kaedah rekursif.

Contoh 1 (Gunakan gelung for untuk mencari hasil tambah 1 hingga n nombor)

Dalam contoh di bawah, kami telah menulis fungsi sumOfN() untuk mendapatkan jumlah 1 hingga N nombor. Kami menggunakan gelung for untuk lelaran N dan dalam setiap lelaran kami menambah nilai I kepada pembolehubah jumlah.

Akhirnya mengembalikan nilai pembolehubah jumlah.

<html>
<body>
   <h3>Using the <i> iterative approach </i> to find sum of n numbers in JavaScript</h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      
      // function to find the sum of n numbers using an iterative approach
      function sumOfN(n) {
         let sum = 0;
         for (let i = n; i >= 1; i--) {
            sum += i;
         }
         return sum;
      }
      content.innerHTML += "The sum of 1 to 10 numbers is " + sumOfN(10) + "<br>";
      content.innerHTML += "The sum of 1 to 20 numbers is " + sumOfN(20) + "<br>";
   </script>
</body>
</html>

Salin selepas log masuk

Dalam contoh di atas, kami menggunakan kaedah lelaran untuk mencari jumlah N nombor. Sekarang, kita akan menggunakan kaedah rekursif untuk melakukan perkara yang sama.

Contoh 2 (Gunakan fungsi rekursif untuk mencari hasil tambah 1 hingga n nombor)

Fungsi

sumOfN() ialah fungsi rekursif dalam contoh di bawah. Kami berulang kali memanggil fungsi sumOfN() dengan mengurangkan nilai hujah dengan 1. sumOfN(N1) mengembalikan jumlah nombor N-1, kami menambah N kepadanya untuk mendapatkan jumlah N nombor. Apabila nilai N menjadi 1, ia mengembalikan 1 sebagai syarat asas untuk menghentikan pelaksanaan fungsi.

<html>
<body>
   <h3>Using the <i> recursive approach </i> to find sum of n numbers in JavaScript</h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      
      // function to find the sum of n numbers using a recursive approach
      function sumOfN(n) {
         
         // base condition
         if (n == 1) {
            return 1;
         }
         
         // call function recursively by decreasing the value of n by 1.
         return n + sumOfN(n - 1);
      }
      content.innerHTML += "The sum of 1 to 10 numbers is " + sumOfN(10) + "<br>";
      content.innerHTML += "The sum of 1 to 20 numbers is " + sumOfN(20) + "<br>";
   </script>
</body>
</html>

Salin selepas log masuk

Mari kita fahami cara fungsi rekursif di atas berfungsi. Di bawah, pengguna boleh mempelajari langkah demi langkah cara panggilan fungsi rekursif berlaku.

sumOfN(5);
return 5 + sumOfN(4);
   return 4 + sumOfN(3);
      return 3 + sumOfN(2);
         return 2 + sumOfN(1);
            return 1;
         return 2 + 1;
      return 3 + 3;
   return 4 + 6;

Salin selepas log masuk

Contoh 3 (Kaedah berulang untuk menggabungkan semua rentetan dalam tatasusunan)

Dalam contoh di bawah, kami mencipta tatasusunan rentetan. Kami mencipta fungsi mergeString() untuk menggabungkan semua rentetan tatasusunan menjadi satu rentetan. Kami menggunakan gelung for untuk melelaran melalui tatasusunan dan menggabungkan semua rentetan ke dalam pembolehubah "str" satu demi satu.

<html>
<body>
   <h3>Using the <i> iterative approach </i> to merge all strings of the array in JavaScript</h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      
      // function to merge all strings of the array using for loop
      function mergeString(arr) {
         let str = '';
         for (let i = 0; i < arr.length; i++) {
            str += arr[i];
         }
         return str;
      }
      let arr = ['I', ' ', 'am', ' ', 'a', ' ', 'programmer'];
      content.innerHTML += "The original array is: " + arr + "<br>";
      content.innerHTML += "After merging all strings of the array into the single string is " + mergeString(arr) + "<br>";
   </script>
</body>
</html>

Salin selepas log masuk

Contoh 4 (kaedah rekursif untuk menggabungkan semua rentetan dalam tatasusunan)

Dalam contoh di bawah, kami telah menukar fungsi mergeString() kepada fungsi rekursif. Kami mengambil elemen pertama tatasusunan dan menggabungkannya dengan hasil pulangan fungsi mergeString(). Fungsi mergeString() mengembalikan elemen tatasusunan n-1 yang terakhir selepas digabungkan. Selain itu, kami menggunakan kaedah slice() untuk mengalih keluar elemen pertama daripada tatasusunan.

Apabila hanya tinggal satu elemen dalam tatasusunan, ia mengembalikan elemen yang sama seperti keadaan asas.

<html>
<body>
   <h3>Using the <i> Recursive approach </i> to merge all strings of the array in JavaScript</h3>
   <div id = "content"> </div>
   <script>
      let content = document.getElementById('content');
      
      // function to merge all strings of the array using recursion
      function mergeString(arr) {
         
         // based condition
         if (arr.length == 1) {
            return arr[0];
         }

         // remove the first element from the array using the slice() method.
         return arr[0] + " " + mergeString(arr.slice(1));
      }
      let arr = ["I", "am", "a", "web", "developer"];
      content.innerHTML += "The original array is: " + arr + "<br>";
      content.innerHTML += "After merging all strings of the array into the single string is " + mergeString(arr) + "<br>";
   </script>
</body>
</html>

Salin selepas log masuk

Kaedah yang manakah harus digunakan oleh pengguna, berulang atau rekursif?

Persoalan utama ialah kaedah yang lebih baik, berulang atau rekursif, dan kaedah mana yang harus digunakan oleh pengguna.

Dalam sesetengah kes, kaedah lelaran adalah lebih pantas daripada kaedah rekursif. Selain itu, rekursi memerlukan lebih banyak memori semasa lelaran. Untuk sesetengah algoritma seperti bahagi dan takluk, rekursi lebih berguna kerana kita perlu menulis kurang kod menggunakan kaedah rekursif. Selain itu, pengguna mungkin menghadapi masalah kebocoran memori jika keadaan asas tidak dicetuskan dalam kaedah rekursif.

Jika kita boleh memecahkan kod kepada bahagian yang lebih kecil, kita harus menggunakan kaedah rekursif, dan untuk meningkatkan prestasi kod, kita harus menggunakan kaedah berulang.

Atas ialah kandungan terperinci Bagaimana untuk memahami rekursi dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!