JavaScript om annat om


Innehållsförteckning

    Visa innehållsförteckning


Villkorliga uttalanden används för att utföra olika åtgärder baserat på olika förutsättningar.


Villkorliga uttalanden

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åtandet

Använd if-satsen för att ange ett block med JavaScript-kod till exekveras om ett villkor är sant.

Syntax

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.

Exempel

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-satsen

Anvä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
 }

Exempel

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-satsen

Använd else if-satsen för att ange ett nytt villkor om det första villkoret är falskt.

Syntax

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
 }

Exempel

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>

Fler exempel

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>