Web-Dev-For-Beginners/translations/da/2-js-basics/3-making-decisions

JavaScript Grundlæggende: At træffe beslutninger

Sketchnote af Tomomi Imura

Har du nogensinde undret dig over, hvordan applikationer træffer smarte beslutninger? Som hvordan et navigationssystem vælger den hurtigste rute, eller hvordan en termostat beslutter, hvornår den skal tænde for varmen? Dette er det grundlæggende koncept for beslutningstagning i programmering.

Ligesom Charles Babbages Analytical Engine blev designet til at følge forskellige sekvenser af operationer baseret på betingelser, skal moderne JavaScript-programmer træffe valg baseret på skiftende omstændigheder. Denne evne til at forgrene sig og træffe beslutninger er det, der forvandler statisk kode til responsive, intelligente applikationer.

I denne lektion lærer du, hvordan du implementerer betinget logik i dine programmer. Vi vil udforske betingede udsagn, sammenligningsoperatorer og logiske udtryk, der gør det muligt for din kode at evaluere situationer og reagere passende.

Quiz før lektionen

Quiz før lektionen

Evnen til at træffe beslutninger og kontrollere programflow er en grundlæggende del af programmering. Dette afsnit dækker, hvordan du styrer eksekveringsvejen for dine JavaScript-programmer ved hjælp af Boolean-værdier og betinget logik.

🎥 Klik på billedet ovenfor for en video om at træffe beslutninger.

Du kan tage denne lektion på Microsoft Learn!

En kort opsummering af Booleans

Før vi udforsker beslutningstagning, lad os genbesøge Boolean-værdier fra vores tidligere lektion. Opkaldt efter matematikeren George Boole repræsenterer disse værdier binære tilstande – enten true eller false. Der er ingen tvetydighed, ingen mellemvej.

Disse binære værdier danner grundlaget for al beregningslogik. Hver beslutning, dit program træffer, reduceres i sidste ende til en Boolean-evaluering.

At oprette Boolean-variabler er ligetil:

let myTrueBool = true;
let myFalseBool = false;

Dette opretter to variabler med eksplicitte Boolean-værdier.

✅ Booleans er opkaldt efter den engelske matematiker, filosof og logiker George Boole (1815–1864).

Sammenligningsoperatorer og Booleans

I praksis vil du sjældent manuelt indstille Boolean-værdier. I stedet genererer du dem ved at evaluere betingelser: "Er dette tal større end det andet?" eller "Er disse værdier ens?"

Sammenligningsoperatorer muliggør disse evalueringer. De sammenligner værdier og returnerer Boolean-resultater baseret på forholdet mellem operandene.

Symbol	Beskrivelse	Eksempel
<	Mindre end: Sammenligner to værdier og returnerer true Boolean-datatype, hvis værdien på venstre side er mindre end højre	5 < 6 // true
<=	Mindre end eller lig med: Sammenligner to værdier og returnerer true Boolean-datatype, hvis værdien på venstre side er mindre end eller lig med højre	5 <= 6 // true
>	Større end: Sammenligner to værdier og returnerer true Boolean-datatype, hvis værdien på venstre side er større end højre	5 > 6 // false
>=	Større end eller lig med: Sammenligner to værdier og returnerer true Boolean-datatype, hvis værdien på venstre side er større end eller lig med højre	5 >= 6 // false
===	Streng lighed: Sammenligner to værdier og returnerer true Boolean-datatype, hvis værdierne på højre og venstre er ens OG har samme datatype.	5 === 6 // false
!==	Ulighed: Sammenligner to værdier og returnerer den modsatte Boolean-værdi af, hvad en streng lighedsoperator ville returnere	5 !== 6 // true

✅ Test din viden ved at skrive nogle sammenligninger i din browsers konsol. Overrasker nogle af de returnerede data dig?

If-sætning

if-sætningen er som at stille et spørgsmål i din kode. "Hvis denne betingelse er sand, så gør dette." Det er sandsynligvis det vigtigste værktøj, du vil bruge til at træffe beslutninger i JavaScript.

Sådan fungerer det:

if (condition) {
  // Condition is true. Code in this block will run.
}

Betingelsen går ind i parenteserne, og hvis den er true, kører JavaScript koden inde i de krøllede parenteser. Hvis den er false, springer JavaScript bare hele blokken over.

Du vil ofte bruge sammenligningsoperatorer til at oprette disse betingelser. Lad os se et praktisk eksempel:

let currentMoney = 1000;
let laptopPrice = 800;

if (currentMoney >= laptopPrice) {
  // Condition is true. Code in this block will run.
  console.log("Getting a new laptop!");
}

Da 1000 >= 800 evalueres til true, udføres koden inde i blokken, og "Får en ny bærbar computer!" vises i konsollen.

If..Else-sætning

Men hvad hvis du vil have, at dit program skal gøre noget andet, når betingelsen er falsk? Det er her, else kommer ind – det er som at have en backup-plan.

else-sætningen giver dig en måde at sige "hvis denne betingelse ikke er sand, gør i stedet dette andet."

let currentMoney = 500;
let laptopPrice = 800;

if (currentMoney >= laptopPrice) {
  // Condition is true. Code in this block will run.
  console.log("Getting a new laptop!");
} else {
  // Condition is false. Code in this block will run.
  console.log("Can't afford a new laptop, yet!");
}

Nu, da 500 >= 800 er false, springer JavaScript den første blok over og kører i stedet else-blokken. Du vil se "Har ikke råd til en ny bærbar computer, endnu!" i konsollen.

✅ Test din forståelse af denne kode og den følgende kode ved at køre den i en browserkonsol. Ændr værdierne for variablerne currentMoney og laptopPrice for at ændre den returnerede console.log().

Switch-sætning

Nogle gange skal du sammenligne én værdi med flere muligheder. Selvom du kunne kæde flere if..else-sætninger sammen, bliver denne tilgang uhåndterlig. switch-sætningen giver en mere overskuelig struktur til at håndtere flere diskrete værdier.

Konceptet minder om de mekaniske koblingssystemer, der blev brugt i tidlige telefoncentraler – én inputværdi bestemmer, hvilken specifik vej eksekveringen følger.

switch (expression) {
  case x:
    // code block
    break;
  case y:
    // code block
    break;
  default:
    // code block
}

Sådan er det struktureret:

• JavaScript evaluerer udtrykket én gang
• Det gennemgår hver case for at finde et match
• Når det finder et match, kører det den kodeblok
• break fortæller JavaScript at stoppe og afslutte switchen
• Hvis ingen cases matcher, kører det default-blokken (hvis du har en)

// Program using switch statement for day of week
let dayNumber = 2;
let dayName;

switch (dayNumber) {
  case 1:
    dayName = "Monday";
    break;
  case 2:
    dayName = "Tuesday";
    break;
  case 3:
    dayName = "Wednesday";
    break;
  default:
    dayName = "Unknown day";
    break;
}
console.log(`Today is ${dayName}`);

I dette eksempel ser JavaScript, at dayNumber er 2, finder den matchende case 2, sætter dayName til "Tirsdag" og bryder derefter ud af switchen. Resultatet? "I dag er det tirsdag" bliver logget til konsollen.

✅ Test din forståelse af denne kode og den følgende kode ved at køre den i en browserkonsol. Ændr værdierne for variablen a for at ændre den returnerede console.log().

Logiske operatorer og Booleans

Komplekse beslutninger kræver ofte evaluering af flere betingelser samtidigt. Ligesom Boolean-algebra giver matematikere mulighed for at kombinere logiske udtryk, giver programmering logiske operatorer til at forbinde flere Boolean-betingelser.

Disse operatorer muliggør sofistikeret betinget logik ved at kombinere simple sand/falsk-evalueringer.

Symbol	Beskrivelse	Eksempel
&&	Logisk OG: Sammenligner to Boolean-udtryk. Returnerer true kun hvis begge sider er true	(5 > 3) && (5 < 10) // Begge sider er true. Returnerer true
||	Logisk ELLER: Sammenligner to Boolean-udtryk. Returnerer true, hvis mindst én side er true	(5 > 10) || (5 < 10) // Én side er false, den anden er true. Returnerer true
!	Logisk IKKE: Returnerer den modsatte værdi af et Boolean-udtryk	!(5 > 10) // 5 er ikke større end 10, så "!" gør det true

Disse operatorer lader dig kombinere betingelser på nyttige måder:

• OG (&&) betyder, at begge betingelser skal være sande
• ELLER (||) betyder, at mindst én betingelse skal være sand
• IKKE (!) vender sand til falsk (og omvendt)

Betingelser og beslutninger med logiske operatorer

Lad os se disse logiske operatorer i aktion med et mere realistisk eksempel:

let currentMoney = 600;
let laptopPrice = 800;
let laptopDiscountPrice = laptopPrice - (laptopPrice * 0.2); // Laptop price at 20 percent off

if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice) {
  // Condition is true. Code in this block will run.
  console.log("Getting a new laptop!");
} else {
  // Condition is false. Code in this block will run.
  console.log("Can't afford a new laptop, yet!");
}

I dette eksempel: vi beregner en rabatpris på 20% (640), og evaluerer derefter, om vores tilgængelige midler dækker enten den fulde pris ELLER rabatprisen. Da 600 opfylder rabatprisgrænsen på 640, evalueres betingelsen til sand.

Negationsoperator

Nogle gange er det nemmere at tænke på, hvornår noget IKKE er sandt. Som i stedet for at spørge "Er brugeren logget ind?", vil du måske spørge "Er brugeren IKKE logget ind?" Udråbstegnet (!) operatør vender logikken for dig.

if (!condition) {
  // runs if condition is false
} else {
  // runs if condition is true
}

!-operatoren er som at sige "det modsatte af..." – hvis noget er true, gør ! det false, og omvendt.

Ternære udtryk

For enkle betingede tildelinger giver JavaScript den ternære operator. Denne korte syntaks giver dig mulighed for at skrive et betinget udtryk på én linje, nyttigt når du skal tildele en af to værdier baseret på en betingelse.

let variable = condition ? returnThisIfTrue : returnThisIfFalse;

Det læses som et spørgsmål: "Er denne betingelse sand? Hvis ja, brug denne værdi. Hvis nej, brug den anden værdi."

Nedenfor er et mere håndgribeligt eksempel:

let firstNumber = 20;
let secondNumber = 10;
let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;

✅ Tag et øjeblik til at læse denne kode et par gange. Forstår du, hvordan disse operatorer fungerer?

Her er, hvad denne linje siger: "Er firstNumber større end secondNumber? Hvis ja, sæt firstNumber i biggestNumber. Hvis nej, sæt secondNumber i biggestNumber."

Den ternære operator er bare en kortere måde at skrive denne traditionelle if..else-sætning:

let biggestNumber;
if (firstNumber > secondNumber) {
  biggestNumber = firstNumber;
} else {
  biggestNumber = secondNumber;
}

Begge tilgange giver identiske resultater. Den ternære operator tilbyder kortfattethed, mens den traditionelle if-else-struktur kan være mere læsbar for komplekse betingelser.

---

🚀 Udfordring

Lav et program, der først er skrevet med logiske operatorer, og omskriv det derefter ved hjælp af et ternært udtryk. Hvilken syntaks foretrækker du?

---

GitHub Copilot Agent Udfordring 🚀

Brug Agent-tilstand til at fuldføre følgende udfordring:

Beskrivelse: Lav en omfattende karakterberegner, der demonstrerer flere beslutningstagende koncepter fra denne lektion, inklusive if-else-sætninger, switch-sætninger, logiske operatorer og ternære udtryk.

Opgave: Skriv et JavaScript-program, der tager en elevs numeriske score (0-100) og bestemmer deres bogstavkarakter ved hjælp af følgende kriterier:

• A: 90-100
• B: 80-89
• C: 70-79
• D: 60-69
• F: Under 60

Krav:

1. Brug en if-else-sætning til at bestemme bogstavkarakteren
2. Brug logiske operatorer til at tjekke, om eleven består (karakter >= 60) OG har udmærkelse (karakter >= 90)
3. Brug en switch-sætning til at give specifik feedback for hver bogstavkarakter
4. Brug en ternær operator til at bestemme, om eleven er berettiget til det næste kursus (karakter >= 70)
5. Inkluder inputvalidering for at sikre, at scoren er mellem 0 og 100

Test dit program med forskellige scores, inklusive kanttilfælde som 59, 60, 89, 90 og ugyldige input.

Læs mere om agent mode her.

Quiz efter lektionen

Quiz efter lektionen

Gennemgang & Selvstudie

Læs mere om de mange operatorer, der er tilgængelige for brugeren på MDN.

Gå igennem Josh Comeaus fantastiske operator-oversigt!

Opgave

Operatorer

---

Ansvarsfraskrivelse:
Dette dokument er blevet oversat ved hjælp af AI-oversættelsestjenesten Co-op Translator. Selvom vi bestræber os på nøjagtighed, skal du være opmærksom på, at automatiserede oversættelser kan indeholde fejl eller unøjagtigheder. Det originale dokument på dets oprindelige sprog bør betragtes som den autoritative kilde. For kritisk information anbefales professionel menneskelig oversættelse. Vi er ikke ansvarlige for eventuelle misforståelser eller fejltolkninger, der opstår som følge af brugen af denne oversættelse.