Iterationsmönster
Iterera över Map och Set med for...of; använd entries/keys/values; konvertera till arrayer; bygg små räknare och listor med unika värden.
Iterationsmönster är en gratis lektion i JavaScript Academy på CoddyKit. Detta är lektion 3 av 3. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för JavaScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i JavaScript Academy innehåller totalt 3 lektioner.
Översikt över iteration
Mål: Lär Er enkel och tydlig iteration.
- Map: entries, keys, values
- Set: values
- Konvertera till arrayer
- Frekvensräknare och unika listor

Map: entries/keys/values
Använd for...of på en Map för att få [key, value]; keys() och values() finns också tillgängliga.
// Map iterates as [key, value] pairs
const prices = new Map();
prices.set("apple", 3);
prices.set("banana", 2);
for (const [item, cost] of prices) {
console.log(item, cost);
}
// You can also use keys() or values()
for (const k of prices.keys()) {
console.log("key:", k);
}
for (const v of prices.values()) {
console.log("value:", v);
}

Set: enkel loop
Set ger unika värden i insättningsordning; dubbletter ignoreras.
// Set iterates values in insertion order
const colors = new Set(["red", "green", "red", "blue"]);
for (const c of colors) {
console.log("color:", c);
}
console.log("size:", colors.size);

Konverteringar med Array.from
Använd Array.from för att omvandla Maps/Sets till arrayer (och par till en Map).
// Convert Map to array of pairs, and back
const map1 = new Map([["a", 1], ["b", 2]]);
const pairs = Array.from(map1); // [["a",1],["b",2]]
console.log("pairs:", pairs);
const map2 = new Map(pairs);
console.log("map2 has a?", map2.has("a"));
// Set to array of values
const set1 = new Set([1, 1, 2, 3]);
const arr = Array.from(set1); // [1,2,3]
console.log("arr:", arr);

Frekvensräknare
En Map-räknare är ett tydligt sätt att räkna förekomster i en lista.
// Count items in an array using Map
function countItems(list) {
const counts = new Map();
for (const x of list) {
const n = counts.get(x) || 0;
counts.set(x, n + 1);
}
return counts;
}
const fruits = ["apple", "banana", "apple", "apple", "banana"];
const counts = countItems(fruits);
// Print counts as "item: n"
for (const [name, n] of counts) {
console.log(name + ":", n);
}

Unika värden och medlemskap
Använd Set för att skapa en unik lista och för snabba medlemskapskontroller med has.
// Unique values with Set, quick membership test
const numbers = [2, 3, 2, 4, 3, 5];
const unique = Array.from(new Set(numbers));
console.log("unique:", unique);
// Quick membership with Set.has
const allowed = new Set([2, 5]);
console.log("allowed has 2?", allowed.has(2));
console.log("allowed has 4?", allowed.has(4));

Quiz om Map-iteration
Snabb kontroll: Bästa Map-loopen för nyckel och värde.

Sammanfattning
Sammanfattning: Iterera över Map med for...of för att få [key, value], loopa direkt över värden i Set och konvertera med Array.from. Använd en Map för räkneverk och en Set för unika listor.

Lär dig JavaScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 59
- Lektioner
- 200
Vanliga frågor
Är lektionen ”Iterationsmönster” gratis?
Ja – du kan läsa vilka 3 lektioner som helst i lärvägen JavaScript Academy, inklusive ”Iterationsmönster”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i JavaScript Academy innehåller totalt 3 lektioner.
Vad lär jag mig i ”Iterationsmönster”?
Iterera över Map och Set med for...of; använd entries/keys/values; konvertera till arrayer; bygg små räknare och listor med unika värden. Ni övar på JavaScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig JavaScript Academy?
Du behöver inga förkunskaper. Utbildningen i JavaScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 3 av 3.
Hur lång tid tar lektionen ”Iterationsmönster”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här JavaScript Academy-lektionen?
Ja. Varje JavaScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.