Pagproseso ng pag-uulit sa JavaScript

Sa artikulong ito, ipapaliwanag namin ang proseso ng pag-uulit sa JavaScript.

YouTube Video

Ang for na deklarasyon sa JavaScript

Pangunahing Syntax

1for (initialization; condition; update) {
2  // Code to repeat
3}

Ang deklarasyong for sa JavaScript ay isang sintaks para sa pagsasagawa ng pag-uulit. Paulit-ulit nitong pinapatakbo ang isang tinukoy na bahagi ng code hangga't natutugunan ang isang partikular na kondisyon. Sa paggamit ng deklarasyong for, maaaring ulitin nang epektibo ang parehong proseso nang maraming beses.

• Pag-uumpisa (initialization): Ang bahagi na isinasagawa nang isang beses lamang bago simulan ang loop. I-initialize ang mga variable tulad ng pangbilang ng loop.
• Kondisyon (condition): Ang kondisyon na nagtatakda kung magpapatuloy ang loop. Kung true, magpapatuloy ang loop; kung false, titigil ito.
• Pag-update (update): Isinasagawa ito sa dulo ng bawat loop upang i-update ang pangbilang ng loop.

Halimbawa

1for (let i = 0; i < 5; i++) {
2    console.log(i);
3}

Sa kasong ito, nagsisimula ang i sa 0, at tumatakbo ang loop hangga't i < 5 ay true. Ang i++ ay nagdaragdag ng 1 sa i sa bawat pag-ikot ng loop. Bilang resulta, ang mga numero mula 0 hanggang 4 ay ipinapakita.

Saklaw ng Pangbilang ng Loop

Ideklara o i-initialize ang mga variable sa bahagi ng pag-uumpisa ng deklarasyong for. Ang mga variable na ideklara dito ay balido lamang sa loob ng loop.

1for (let i = 0; i < 3; i++) {
2    console.log(i); // Outputs 0, 1, 2
3}
4console.log(i);  // ReferenceError

• Tulad ng ipinakita sa halimbawang ito, ang pagtukoy sa isang variable sa labas ng for na pahayag ay magreresulta sa isang error.

Walang Hanggang Loop

Ang pagtatakda ng kondisyon na hindi nagpapahinto sa loop ay magreresulta sa isang walang hanggang loop. Ito ay maaaring magdulot ng stress sa browser o sistema, kaya kinakailangan ng pag-iingat.

1for (;;) {
2    console.log("Infinite loop");
3    break; // Exits the infinite loop with break
4}

Mga Array at ang Deklarasyong for

Karaniwang ginagamit ang deklarasyong for kasama ng mga array. Ito ay maginhawa para sa pagpoproseso ng bawat elemento ng isang array.

Halimbawa

1let fruits = ["apple", "banana", "cherry"];
2
3for (let i = 0; i < fruits.length; i++) {
4    console.log(fruits[i]);
5}
6// Outputs "apple", "banana", "cherry"

Sa ganitong paraan, maaari mong iproseso ang bawat elemento ng isang array gamit ang mga indeks.

Iba Pang Mga Estruktura ng Loop

for...of Pahayag

Ang for...of na pahayag ay ginagamit para sa mga iterable na bagay tulad ng mga array at string.

1let fruits = ["apple", "banana", "cherry"];
2
3for (let fruit of fruits) {
4    console.log(fruit);
5}
6// Outputs "apple", "banana", "cherry"

Ito ay nagbibigay-daan sa iyo na iproseso ang bawat elemento nang hindi gumagamit ng mga indeks.

for...in Pahayag

Ang for...in na pahayag ay ginagamit para mag-iterate sa mga katangian ng isang object.

1let person = { name: "John", age: 30, city: "Tokyo" };
2
3for (let key in person) {
4    console.log(key + ": " + person[key]);
5}
6// Outputs "name: John", "age: 30", "city: Tokyo"

Sa paraang ito, maaari kang magsagawa ng mga operasyon sa bawat elemento gamit ang mga key.

Buod

• Ang for na pahayag ay isang estruktura ng loop na may tatlong bahagi: pagpapasimula, kondisyon, at pag-update.
• Maaari mong kontrolin ang pagkilos ng mga loop gamit ang break o continue.
• Kapag pinagsama sa mga array o object, ang mga elemento o katangian ay maaaring iproseso nang mahusay.

Ang while na Pahayag sa JavaScript

Pangunahing Syntax

1while (condition) {
2    // Code that repeats while the condition is true
3}

Ang while na pahayag sa JavaScript ay isang estruktura ng loop na nagpapatupad ng paulit-ulit na mga operasyon hangga't ang tinukoy na kondisyon ay true. Katulad ng for na pahayag, ang while na pahayag ay tumutukoy lamang sa kondisyon.

• Kondisyon: Isulat ang ekspresyong kondisyonal na tumutukoy kung magpapatuloy ang loop. Ang loop ay nagpapatuloy habang true at nagtatapos kapag ito ay naging false.

Halimbawa

1let i = 0;
2
3while (i < 5) {
4    console.log(i);
5    i++;
6}
7console.log(i);  // 5

Sa halimbawang ito, nagsisimula ang loop sa variable na i sa 0 at nagpapatupad hangga't ang i < 5 ay true. Sa bawat pag-ikot ng loop, ang i ay nadaragdagan ng 1, at kapag ang i ay naging 5, nagiging false ang kondisyon at nagtatapos ang loop. Bilang resulta, ang while na pahayag ay nagpapakita mula 0 hanggang 4.

Hindi tulad ng for na pahayag, sa while na pahayag, ang pagpapasimula at pag-update ng mga variable ay isinusulat bilang magkakahiwalay na mga pahayag. Maaari mo ring tukuyin ang variable pagkatapos ng while na pahayag. Sa kasong ito, ang 5 ay ipinapakita pagkatapos matapos ang while na pahayag.

Walang Hanggang Loop

Kung ang kondisyon ay laging true, isang walang katapusang loop ang nangyayari na hindi nagtatapos. Dapat iwasan ang mga walang katapusang loop, ngunit kung gagamitin nang sadya, maaari mong tapusin ang loop gamit ang isang break na pahayag.

Halimbawa

1while (true) {
2    console.log("Infinite loop");
3    break;  // Ends the loop with `break`
4}

Pagpoproseso ng Mga Array gamit ang while Loop

Posible ring magproseso ng mga array gamit ang while na pahayag.

Halimbawa

1let fruits = ["apple", "banana", "cherry"];
2let i = 0;
3
4while (i < fruits.length) {
5    console.log(fruits[i]);
6    i++;
7}
8// Outputs "apple", "banana", "cherry"

Pahayag na do...while

Pangunahing Syntax

1do {
2    // Code that is executed at least once
3} while (condition);

Ang pahayag na do...while, isang bersyon ng pahayag na while, ay sinusuri ang kondisyon pagkatapos maisagawa ang loop kahit isang beses. Habang ang pahayag na while ay sinusuri muna ang kondisyon, ang pahayag na do...while ay nagsasagawa muna ng proseso bago suriin ang kondisyon.

Halimbawa

1let i = 0;
2
3do {
4    console.log(i);
5    i++;
6} while (i < 5);

Sa halimbawang ito, ang i ay ipinapakita mula 0 hanggang 4. Ang pahayag na do...while ay naiiba sa pahayag na while dahil ito ay laging isinasagawa kahit isang beses, kahit na ang kondisyon ay false.

Buod

• Ang pahayag na while ay ginagamit upang paulit-ulit isagawa ang code hangga't ang kondisyon ay true.
• Mag-ingat sa mga walang katapusang loop, ngunit maaari mong kontrolin ang daloy ng mga loop gamit ang break at continue.
• Ang pahayag na do...while ay kapaki-pakinabang kung nais mong isagawa ang loop kahit isang beses.

break at continue

Maaari mong gamitin ang break at continue sa loob ng loop.

• Ang break ay ginagamit upang mawakasan ang loop nang maaga.
• Ang continue ay nilalaktawan ang kasalukuyang pag-uulit at nagpapatuloy sa susunod na pag-uulit.

Halimbawa ng break

 1for (let i = 0; i < 10; i++) {
 2    if (i === 5) {
 3        break;  // Exits the loop when i is 5
 4    }
 5    console.log(i);
 6}
 7// Outputs 0, 1, 2, 3, 4
 8
 9let i = 0;
10
11while (i < 10) {
12    if (i === 5) {
13        break;  // Ends the loop when i is 5
14    }
15    console.log(i++);
16}
17// Outputs 0, 1, 2, 3, 4

Sa kasong ito, ang break ay isinasagawa kapag ang i ay naging 5. Bilang resulta, ang mga numero mula 0 hanggang 4 ay ipinapakita.

Halimbawa ng continue

 1for (let i = 0; i < 5; i++) {
 2    if (i === 2) {
 3        continue;  // Skips when i is 2
 4    }
 5    console.log(i);
 6}
 7// Outputs 0, 1, 3, 4
 8
 9let i = 0;
10while (i < 5) {
11    i++;
12    if (i === 3) {
13        continue;  // Skips when i is 3
14    }
15    console.log(i);
16}
17// Outputs 1, 2, 4, 5

Sa kasong ito, ang continue ay isinasagawa kapag ang i ay 2. Bilang resulta, ang mga numero maliban sa 2 ay ipinapakita.

Mga Nested Loop sa JavaScript

Sa JavaScript programming, ang nested loop ay isang istruktura kung saan mayroong isang loop sa loob ng isa pa. Ang ganitong mga loop ay epektibo kung ang mga partikular na algorithm o proseso ay saklaw ang maraming dimensyon o layer. Halimbawa, ang pagproseso ng isang multidimensional na array na may mga array sa loob ng mga array ay isang karaniwang kaso.

Dito, ipapaliwanag namin ang batayang istruktura ng mga nested loop, mga halimbawa ng paggamit, mga pag-iingat, at mga konsiderasyon sa pag-optimize.

Batayang Istruktura ng Mga Nested Loop

Ang pangunahing istruktura ng isang nested loop ay isang anyo kung saan ang isa o higit pang mga loop ay nakapaloob sa isa pang loop. Sa tuwing ang panlabas na loop ay naisakatuparan nang isang beses, ang panloob na loop ay naisakatuparan nang maraming beses.

Nasa ibaba ang isang pangunahing halimbawa ng dalawang nested loop.

 1for (let i = 0; i < 3; i++) {
 2    console.log(`Outer loop iteration: ${i}`);
 3
 4    for (let j = 0; j < 2; j++) {
 5        console.log(`  Inner loop iteration: ${j}`);
 6    }
 7}
 8// Output:
 9// Outer loop iteration: 0
10//   Inner loop iteration: 0
11//   Inner loop iteration: 1
12// Outer loop iteration: 1
13//   Inner loop iteration: 0
14//   Inner loop iteration: 1
15// Outer loop iteration: 2
16//   Inner loop iteration: 0
17//   Inner loop iteration: 1

Sa code sa itaas, ang i ay binibilang sa panlabas na loop, at ang j ay binibilang sa panloob na loop. Sa tuwing ang panlabas na loop ay naisakatuparan nang isang beses, ang panloob na loop ay naisakatuparan nang dalawang beses.

Praktikal na Halimbawa ng Nested Loops

Ang mga nested loop ay partikular na kapaki-pakinabang para sa paghawak ng multidimensional arrays. Halimbawa, kapag nagpoproseso ng isang two-dimensional na array, kailangang hawakan ang parehong mga hilera (panlabas na loop) at mga kolum (panloob na loop).

Sa sumusunod na halimbawa, pinoproseso namin ang isang two-dimensional na array at inililimbag ang bawat elemento.

 1const matrix = [
 2  [1, 2, 3],
 3  [4, 5, 6],
 4  [7, 8, 9]
 5];
 6
 7for (let row = 0; row < matrix.length; row++) {
 8    for (let col = 0; col < matrix[row].length; col++) {
 9        console.log(`Element at [${row}][${col}] is: ${matrix[row][col]}`);
10    }
11}
12// Output:
13// Element at [0][0] is: 1
14// Element at [0][1] is: 2
15// Element at [0][2] is: 3
16// Element at [1][0] is: 4
17// Element at [1][1] is: 5
18// Element at [1][2] is: 6
19// Element at [2][0] is: 7
20// Element at [2][1] is: 8
21// Element at [2][2] is: 9

Sa ganitong paraan, ang paggamit ng nested loop ay nagbibigay-daan sa pag-access sa bawat elemento ng isang two-dimensional na array.

Mga Tala

Mayroong ilang mga punto na dapat isaalang-alang kapag gumagamit ng nested loops.

1. Mga Isyu sa Performance

   Habang ang mga nested loop ay nagiging mas malalim, ang oras ng pagpapatupad ay tumataas nang husto. Halimbawa, kung ang panlabas na loop ay naisakatuparan nang 100 beses at ang panloob na loop nang 100 beses, isang kabuuang 10,000 operasyon ang naisakatuparan. Kaya, kung maraming pag-uulit ng loop, dapat mong isaalang-alang ang pag-optimize ng loop para sa kahusayan.

2. Aplikasyon sa Mga Komplikadong Algorithm

   Ang mga nested loop ay napakalakas, ngunit habang nagiging kumplikado ang pagproseso, ang code ay maaaring maging mahirap unawain. Samakatuwid, upang mapanatili ang pagiging mabasa ng code, mahalagang ayusin ang pagproseso sa pamamagitan ng angkop na mga komento at mga function.

Mga Pagsasaalang-alang sa Pag-optimize

Kapag gumagamit ng nested loops, ang mga sumusunod na pag-optimize ay maaaring isaalang-alang.

1. Maagang Pagwawakas ng Loop

   Kung ang isang partikular na kundisyon ay natugunan sa loob ng loop, maaari mong gamitin ang break na utos upang lumabas sa loop. Ito ay maaaring maiwasan ang hindi kinakailangang mga loop at mapabuti ang performance.

1for (let i = 0; i < 5; i++) {
2    for (let j = 0; j < 5; j++) {
3        if (i + j > 5) {
4            break;
5        }
6        console.log(`i: ${i}, j: ${j}`);
7    }
8}

2. Ilipat ang Mga Kalkulasyon sa Labas

   Sa halip na isagawa ang parehong kalkulasyon sa loob ng loop sa bawat oras, maaari mo itong isagawa nang isang beses sa labas ng loop at gamitin ang resulta upang gawing mas mahusay ang proseso.

 1let array = [1, 2, 3, 4, 5];
 2
 3// Inefficient example (calculating every time)
 4for (let i = 0; i < array.length; i++) {
 5    for (let j = 0; j < array.length; j++) {
 6        let sum = array[i] + array[j];
 7        console.log(sum);
 8    }
 9}
10
11// Efficient example (calculating outside)
12let arrayLength = array.length;
13for (let i = 0; i < arrayLength; i++) {
14    for (let j = 0; j < arrayLength; j++) {
15        let sum = array[i] + array[j];
16        console.log(sum);
17    }
18}

Buod

Ang mga nested loop ay napaka-kapaki-pakinabang sa paghawak ng mga komplikadong istruktura ng data at mga algorithm sa JavaScript. Gayunpaman, kung hindi tamang ginagamit, maaari itong magdulot ng pagbagsak ng performance at pagbawas sa pagiging mababasa ng code. Upang magamit nang epektibo ang mga nested loop, mahalaga na magsikap para sa pag-optimize ng loop at organisasyon ng code, at gumamit ng tamang mga pamamaraan depende sa sitwasyon.

Maaari mong sundan ang artikulo sa itaas gamit ang Visual Studio Code sa aming YouTube channel. Paki-check din ang aming YouTube channel.

YouTube Video