Villkorliga uttalanden används för att utföra olika åtgärder baserat på olika förutsättningar.
Mycket ofta när du skriver kod vill du utföra olika åtgärder för olika beslut.
Du kan använda villkorliga uttalanden i din kod för att göra detta.
I JavaScript har vi följande villkorliga uttalanden:
Använd if
för att ange ett kodblock som ska exekveras, om ett angivet villkor är sant
Använd else
för att ange ett kodblock som ska exekveras, om samma villkor är falsk
Använd else if
för att ange ett nytt villkor att testa, om det första villkoret är falskt
Använd switch
för att ange många alternativa kodblock som ska köras
switch
-satsen beskrivs i nästa kapitel.
if
-utlåtandetAnvänd if
-satsen för att ange ett block med JavaScript-kod till exekveras om ett villkor är sant.
if (condition) {
// block of code to be executed if the condition is true
}
Observera att if
står med små bokstäver. Versaler (If eller IF) genererar ett JavaScript-fel.
Gör en "God dag"-hälsning om timmen är mindre än 18:00:
if (hour < 18) {
greeting = "Good day";
}
Resultatet av hälsningen blir:
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript if</h2>
<p>Display "Good day!" if the hour is less than 18:00:</p>
<p id="demo">Good Evening!</p>
<script>
if (new Date().getHours() < 18) {
document.getElementById("demo").innerHTML = "Good day!";
}
</script>
</body>
</html>
else
-satsenAnvänd else
-satsen för att ange ett kodblock som ska vara exekveras om villkoret är falsk.
if (condition) {
// block of code to be executed if the condition is true
}
else {
// block of code to be executed if the condition is false
}
Om timmen är mindre än 18, skapa en "God dag" hälsning, annars "God kväll":
if (hour < 18) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Resultatet av hälsningen blir:
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript if .. else</h2>
<p>A time-based greeting:</p>
<p id="demo"></p>
<script>
const hour = new Date().getHours();
let greeting;
if (hour < 18) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
document.getElementById("demo").innerHTML = greeting;
</script>
</body>
</html>
else if
-satsenAnvänd else if
-satsen för att ange ett nytt villkor om det första villkoret är falskt.
if (condition1) {
// block of code to be executed if condition1 is true
}
else if (condition2) {
// block of code to be executed if the condition1 is false and condition2 is true
} else {
// block of code to be executed if the condition1 is false and condition2 is false
}
Om tiden är mindre än 10:00, skapa en "Bra morgon" hälsning, om inte, men tiden är mindre än 20:00, skapa en "God dag"-hälsning, annars en "god kväll":
if (time < 10) {
greeting = "Good morning";
}
else if (time < 20) {
greeting = "Good day";
}
else {
greeting = "Good evening";
}
Resultatet av hälsningen blir:
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript if .. else</h2>
<p>A time-based greeting:</p>
<p id="demo"></p>
<script>
const time = new Date().getHours();
let greeting;
if (time < 10) {
greeting = "Good morning";
} else if (time < 20) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
document.getElementById("demo").innerHTML = greeting;
</script>
</body>
</html>
Slumpmässig länk
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Math.random()</h2>
<p id="demo"></p>
<script>
let text;
if (Math.random() < 0.5) {
text = "<a href='https://w3schools.com'>Visit W3Schools</a>";
} else {
text = "<a href='https://wwf.org'>Visit WWF</a>";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>