TypeScript Repetitionssatser

Den här artikeln förklarar repetitionssatser i TypeScript.

YouTube Video

for-satsen i TypeScript

for-satsen i TypeScript är en grundläggande loopstruktur för att utföra repetitiva operationer. I en for-loop kan samma kodblock upprepade gånger köras baserat på ett angivet antal gånger eller villkor.

Grundläggande syntax

1for (initialization; condition; update) {
2    // Code to execute repeatedly while the condition is true
3}

• ** Initialisering**: Detta är den del som utförs först en gång innan du startar slingan. Initiera variabler som loop counters.
• ** Villkor (”villkor”)*: Fastställer om loopen fortsätter. Om det är sant, fortsätt att slinga, och om falskt, lämna.
• **Uppdatering (”uppdatering”)*: Kör i slutet av varje slinga och uppdatera loop counter.

Exempel 1: Grundläggande for-loop

I exemplet nedan skriver den ut siffrorna från 0 till 4 i ordning.

1for (let i = 0; i < 5; i++) {
2    console.log("The value of i is: " + i);
3}
4// Outputs:
5// The value of i is: 0
6// The value of i is: 1
7// The value of i is: 2
8// The value of i is: 3
9// The value of i is: 4

Exempel 2: for-loop med en array

Du kan också använda en for-loop för att bearbeta elementen i en array i ordning.

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

Exempel 3: for-in-loop

for-in-loopen används för att iterera över egenskaperna hos ett objekt eller indexen i en array i ordning.

1let car = { brand: "Toyota", model: "Corolla", year: 2020 };
2
3for (let key in car) {
4    console.log(key + ": " + car[key]);
5}
6// Outputs:
7// brand: Toyota
8// model: Corolla
9// year: 2020

Exempel 4: for-of-loop

for-of-loopen används för att få varje elements värde i ordning från itererbara objekt som arrayer eller strängar.

1let colors: string[] = ["red", "green", "blue"];
2
3for (let color of colors) {
4    console.log("Color: " + color);
5}
6// Outputs:
7// Color: red
8// Color: green
9// Color: blue

Exempel 5: Nästlade for-loopar

Det är också möjligt att använda en for-loop inom en annan for-loop, känd som en nästlad loop. Detta gör det möjligt att skapa dubbla loopar, bland annat.

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

Sammanfattning

• for-satsen utför repetitiva processer baserat på angivna räkningar eller villkor.
• for-in används för att hämta egenskaperna hos ett objekt eller indexen av en array.
• for-of hämtar värdena från element i itererbara objekt som arrayer.
• Komplexa repetitiva processer är också möjliga med nästlade for-loopar.

for-satsen i TypeScript erbjuder kraftfull och flexibel repetitiv bearbetning, liknande andra loopar.

While-satser i TypeScript

I TypeScript är en while-sats en loopkonstruktion som utför en repetitiv process så länge som det angivna villkoret är true. Precis som for-loopen är while-loopen lämplig för fall där antalet iterationer inte är förutbestämt, eller när du vill kontrollera repetition baserat på ett villkor.

Grundläggande syntax

1while (condition) {
2    // Code to execute repeatedly while the condition is true
3}

• Villkor: Villkoret under vilket loopen körs. Loopen fortsätter så länge detta villkor är true och upphör när det blir false.

Exempel 1: Grundläggande while-loop

I exemplet nedan fortsätter det att skriva ut värdet på i så länge i är mindre än 5.

 1let i: number = 0;
 2
 3while (i < 5) {
 4    console.log("The value of i is: " + i);
 5    i++;
 6}
 7// Outputs:
 8// The value of i is: 0
 9// The value of i is: 1
10// The value of i is: 2
11// The value of i is: 3
12// The value of i is: 4

I detta exempel avslutas loopen när i blir 5 eller större eftersom villkoret blir false.

Exempel 2: Exempel på oändlig loop

Om villkoret i en while-loop alltid är true kan det bli en oändlig loop. Detta gör ofta att programmet misslyckas med att stoppa som avsett, så försiktighet krävs.

 1let x: number = 0;
 2
 3while (true) {
 4    console.log("The value of x is: " + x);
 5    x++;
 6    if (x >= 5) {
 7        break; // Exit the loop when the condition is met
 8    }
 9}
10// Outputs:
11// The value of x is: 0
12// The value of x is: 1
13// The value of x is: 2
14// The value of x is: 3
15// The value of x is: 4

Du kan använda break-satsen för att tvinga ut ur loopen när ett villkor uppfylls.

Exempel 3: do-while-loop

do-while-loopen är en struktur där lopprocessen utförs minst en gång. Eftersom villkoret utvärderas efter processen körs processen minst en gång även om villkoret är false.

1let j: number = 5;
2
3do {
4    console.log("The value of j is: " + j);
5    j++;
6} while (j < 5);
7// Outputs: The value of j is: 5

I detta exempel är j 5 från början, och j < 5 är false, men i en do-while-loop körs det minst en gång oavsett villkoret.

Sammanfattning

• En while-loop upprepar processen så länge villkoret är true.
• Om loopens avslutningsvillkor är oklart måste du vara försiktig med oändliga loopar.
• En do-while-loop skiljer sig från en vanlig while-loop genom att processen utförs minst en gång.

while-satsen i TypeScript är användbar för loopbearbetning med osäkra iterationsantal eller när dynamisk villkorskontroll krävs.

break och continue

Du kan använda break och continue i looper.

• break används för att avsluta en loop i förtid.
• continue används för att hoppa över den aktuella iterationen och gå till nästa iteration.

Exempel på 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

I detta fall verkställs break när i blir 5. Som resultat visas siffrorna från 0 till 4.

Exempel på 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;
10
11while (i < 5) {
12    i++;
13    if (i === 3) {
14        continue;  // Skips when i is 3
15    }
16    console.log(i);
17}
18// Outputs 1, 2, 4, 5

I detta fall verkställs continue när i är 2. Som resultat visas siffrorna förutom 2.

Nästa loopar i TypeScript

En nästlad loop är en struktur där en loop används inom en annan loop. I TypeScript stöds loopkonstruktioner som for, while och do-while. Genom att använda nästlade looper kan du bearbeta tvådimensionella arrayer (matriser) och effektivisera bearbetningen baserat på flera villkor.

Grundläggande syntax

Den grundläggande syntaxen för en nästlad loop är som följer.

1for (let i: number = 0; i < n; i++) {
2  for (let j: number = 0; j < m; j++) {
3    // Processing for the inner loop
4  }
5}

För varje körning av den yttre loopen slutför den inre loopen alla sina iterationer. Denna struktur är mycket användbar när man arbetar med flera looper eller datastrukturer.

Exempel på en nästlad loop i TypeScript

Gå igenom en tvådimensionell array

Nästlade looper används ofta när man bearbetar flerdimensionella datastrukturer som tvådimensionella arrayer. I följande exempel gås elementen i en tvådimensionell array igenom och deras värden visas i konsolen.

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

I detta exempel går vi igenom den tvådimensionella arrayen matrix. Den yttre loopen hanterar raderna, och den inre loopen hanterar kolumnerna, och visar varje element i ordning.

Kombination av två arrayer

Nästa steg är att introducera ett exempel där alla kombinationer av två arrayer beräknas. Till exempel kan du ta ett element från var och en av två arrayer och visa alla möjliga par.

 1const array1: string[] = ['A', 'B', 'C'];
 2const array2: number[] = [1, 2, 3];
 3
 4for (let i: number = 0; i < array1.length; i++) {
 5  for (let j: number = 0; j < array2.length; j++) {
 6    console.log(`Pair: (${array1[i]}, ${array2[j]})`);
 7  }
 8}
 9// Output
10// Pair: (A, 1)
11// Pair: (A, 2)
12// Pair: (A, 3)
13// Pair: (B, 1)
14// Pair: (B, 2)
15// Pair: (B, 3)
16// Pair: (C, 1)
17// Pair: (C, 2)
18// Pair: (C, 3)

I detta exempel skapas alla par mellan strängarrayen array1 och nummerarrayen array2. Den yttre loopen hämtar element från array1, och den inre loopen hämtar element från array2, och visar varje par.

Generera koordinater med en trippelloop

Genom att använda tre nästlade loopar kan du till exempel generera koordinater i ett tredimensionellt rum.

 1for (let x: number = 0; x < 3; x++) {
 2  for (let y: number = 0; y < 3; y++) {
 3    for (let z: number = 0; z < 3; z++) {
 4      console.log(`Coordinate: (${x}, ${y}, ${z})`);
 5    }
 6  }
 7}
 8// Output
 9// Coordinate: (0, 0, 0)
10// Coordinate: (0, 0, 1)
11// Coordinate: (0, 0, 2)
12// ...
13// Coordinate: (2, 2, 1)
14// Coordinate: (2, 2, 2)

På detta sätt kan du enkelt generera koordinater i ett tredimensionellt rum med hjälp av tre nästlade loopar.

Prestanda för nästlade loopar

Nästlade loopar är praktiska, men beräkningskostnaden ökar snabbt när looparnas djup ökar. Till exempel, om det finns n iterationer av den yttre loopen och m iterationer av den inre loopen, blir det totala antalet iterationer n * m. När detta blir ytterligare nästlat ökar beräkningskomplexiteten exponentiellt, vilket potentiellt kan påverka programmets prestanda.

Nedan visas beräkningskomplexiteterna vid traversal av tre arrayer.

 1const array1: number[] = [1, 2, 3];
 2const array2: number[] = [4, 5, 6];
 3const array3: number[] = [7, 8, 9];
 4
 5for (let i: number = 0; i < array1.length; i++) {
 6  for (let j: number = 0; j < array2.length; j++) {
 7    for (let k: number = 0; k < array3.length; k++) {
 8      console.log(`Combination: (${array1[i]}, ${array2[j]}, ${array3[k]})`);
 9    }
10  }
11}

I detta fall behöver du beräkna array1.length * array2.length * array3.length, vilket resulterar i 3 * 3 * 3 = 27 iterationer för att bearbeta alla kombinationer.

Optimering av nästlade loopar

När du använder nästlade loopar kan du förbättra prestandan genom att överväga följande optimeringar.

1. Inför tidig avslutning: Avsluta loopen tidigt när målet är uppnått för att undvika onödiga iterationer.
2. Cacha loopvariabler: Förhandslagra värdena på variabler som används inom loopen (särskilt längder och intervall) för att minska beräkningskostnaden varje gång.
3. Byt datastrukturer: Att revidera strukturen på arrayer och objekt kan vara effektivt för att snabba upp vissa repetitiva processer.

Slutsats

Nästlade loopar är ett kraftfullt verktyg för komplex databehandling och algoritmer. Men när looparnas djup och antalet iterationer ökar kan prestandaproblem uppstå. Med lämpliga optimeringar och noggrann design kan du effektivt använda nästlade loopar i TypeScript.

Du kan följa med i artikeln ovan med hjälp av Visual Studio Code på vår YouTube-kanal. Vänligen kolla även in YouTube-kanalen.

YouTube Video