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

Bagaimana untuk menggunakan bersarang untuk gelung dalam JavaScript?

WBOY
Lepaskan: 2023-09-05 10:45:02
ke hadapan
1025 orang telah melayarinya

Bagaimana untuk menggunakan bersarang untuk gelung dalam JavaScript?

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
}
Salin selepas log masuk

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
}
Salin selepas log masuk

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>
Salin selepas log masuk

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>
Salin selepas log masuk

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!

sumber:tutorialspoint.com
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan