Rumah > Artikel > hujung hadapan web > Bagaimana untuk menggunakan bersarang untuk gelung dalam JavaScript?

Bagaimana untuk menggunakan bersarang untuk gelung dalam JavaScript?

WBOYke hadapan: 2023-09-05 10:45:02947semak imbas

Kami menggunakan penyataan gelung for JavaScript untuk mengulang set pernyataan dalam badan gelung beberapa kali tertentu. Bersarang untuk gelung, seperti namanya, terdiri daripada berbilang untuk gelung, satu gelung bersarang di dalam gelung lain. Ini membolehkan kami mengulangi struktur data berbilang dimensi seperti matriks.

Bersarang untuk gelung dalam JavaScript

Gelung ringkas melaksanakan beberapa kali tertentu berdasarkan nilai permulaan dan syarat penamatan. Bersarang untuk gelung, sebaliknya, mempunyai satu atau lebih gelung yang berada di dalam gelung luar untuk.

Tatabahasa

for(let i = 0 ; i < limit; i++){
   // statement
}

Ini akan mencipta gelung untuk mudah yang melaksanakan had masa. Ini bermakna ia melaksanakan pernyataan dalam badan gelung terhad kali.

Dalam gelung bersarang, pernyataan di dalam badan gelung for ialah satu lagi gelung. Ini menyebabkan gelung dalam untuk dilaksanakan pada setiap lelaran bagi gelung luar.

for(let i = 0 ; i < limit; i++){
   for(let j = 0 ; j < limit; j++){
      // statement
   }
   // statement for outer loop
}

Gelung dalam dalam contoh ini berjalan had kali untuk setiap lelaran gelung luar. Oleh itu, gelung menjalankan sejumlah had x masa had.

Nilai permulaan, syarat penamatan dan kemas kini pembolehubah gelung bagi dua gelung adalah bebas antara satu sama lain.

Mari lihat cara bersarang untuk gelung berfungsi melalui contoh.

Contoh 1

Di sini kita akan menggunakan gelung bersarang untuk mencipta matriks dua dimensi "#".

Mari kita lihat kod yang sama.

<!DOCTYPE html>
<html>
<body>
   <h3> The nested for loop in JavaScript</h3>
   <p> Enter number of rows and columns to create matrix</p>
   <form>
      <label >Rows : </label>
      <input type = "text" id = "rows"><br><br>
      <label > Columns : </label>
      <input type = "text" id = "cols"><br><br>
      <input type = "button" onclick = "fun()" value = "Create Matrix">
   </form>
   <br><br>
   <div id="result"></div>
   <script>
      function fun(){
         var text = "";
         var rows = document.getElementById("rows").value;
         var cols = document.getElementById("cols").value;
         for(let i = 0 ; i < rows; i++){
            for(let j = 0 ; j < cols ; j++){
               text += "#"
            }
            text += "<br>";
         }
         document.getElementById("result").innerHTML = text;
      }
   </script>
</body>
</html>

Dalam kod di atas, kami mengambil input bilangan baris dan lajur dan kemudian mencipta matriks yang ditentukan menggunakan gelung bersarang. Perhatikan bahawa keadaan penamatan gelung luar menentukan bilangan baris matriks, dan keadaan penamatan gelung dalam menentukan bilangan lajur matriks.

Anda boleh melaraskan parameter gelung (nilai permulaan, keadaan penamatan, kemas kini) dan menggunakan gelung bersarang untuk melaksanakan hampir semua jenis traversal bersarang.

Mari lihat cara mencetak piramid menggunakan gelung bersarang.

Contoh 2

Di sini kita akan membuat piramid menggunakan simbol * dan ketinggian yang diberikan oleh pengguna. Mari kita lihat kod yang sama.

<!DOCTYPE html>
<html>
<body>
   <h3>The nested for loop in javascript</h3>
   <p>Enter the height of the pyramid:</p>
   <form>
      <label>Height : </label>
      <input type="text" id="height"><br><br>
      <input type="button" onclick="fun()" value="Create Pyramid">
   </form>
   <br><br>
   <div id="result"></div>
   <script>
      function fun() {
         var text = "";
         var height = document.getElementById("height").value;

         // loop 1
         for (let i = 0; i < height; i++) {
            // loop 2
            for (let j = 0; j < height - i; j++) {
               text += " "
            }
            // loop 3
            for (let j = 0; j <= i; j++) {
               text += "*";
            }
            text += "<br>";
         }
         document.getElementById("result").innerHTML = text;
      }
   </script>
</body>
</html>

Dalam kod di atas, seperti yang ditunjukkan dalam output, kita boleh memvisualisasikan banyak corak traversal yang berbeza selepas menukar parameter gelung.

NotaGelung luar (gelung 1) dalam program menentukan ketinggian piramid. Gelung dalaman pertama (gelung 2) menentukan bilangan aksara ruang pada permulaan setiap baris. Gelung dalam kedua (gelung 3) mencetak sebanyak * aksara sebagai ketinggian piramid dalam lelaran semasa.

Kesimpulan

Gelung bersarang adalah struktur yang sangat berguna yang serba boleh dan sering digunakan.

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

Kenyataan：

Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam

Artikel sebelumnya：Bagaimana untuk menukar tanda sempang kepada camelCase dalam JavaScript?Artikel seterusnya：Bagaimana untuk menukar tanda sempang kepada camelCase dalam JavaScript?

Artikel berkaitan

Lihat lagi