JavaScript, wenn sonst, sonst wenn


Inhaltsverzeichnis

    Inhaltsverzeichnis anzeigen


Bedingte Anweisungen werden verwendet, um unterschiedliche Aktionen basierend auf unterschiedlichen Bedingungen auszuführen.


Bedingte Anweisungen

Wenn Sie Code schreiben, möchten Sie häufig unterschiedliche Aktionen für unterschiedliche Entscheidungen ausführen.

Sie können dazu bedingte Anweisungen in Ihrem Code verwenden.

In JavaScript haben wir die folgenden bedingten Anweisungen:

  • Verwenden Sie if, um einen Codeblock anzugeben, der ausgeführt werden soll, wenn eine angegebene Bedingung wahr ist

  • Verwenden Sie else, um einen Codeblock anzugeben, der ausgeführt werden soll, wenn die gleiche Bedingung vorliegt FALSCH

  • Verwenden Sie else if, um eine neue Bedingung anzugeben, die getestet werden soll, wenn die erste Bedingung falsch ist

  • Verwenden Sie switch, um viele alternative Codeblöcke anzugeben, die ausgeführt werden sollen

Die switch-Anweisung wird im nächsten Kapitel beschrieben.


Die if-Anweisung

Verwenden Sie die if-Anweisung, um einen Block JavaScript-Code anzugeben ausgeführt werden, wenn eine Bedingung wahr ist.

Syntax

if (condition) {
  //  block of code to be executed if the condition is true
 }

Beachten Sie, dass if in Kleinbuchstaben geschrieben ist. Großbuchstaben (If oder IF) erzeugen einen JavaScript-Fehler.

Beispiel

Machen Sie einen „Guten Tag“-Gruß, wenn die Stunde kürzer ist als 18:00:

if (hour < 18) {
    greeting = "Good day";
 }

Das Ergebnis der Begrüßung wird sein:

Probieren Sie es selbst aus →

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


Die else-Anweisung

Verwenden Sie die Anweisung else, um einen Codeblock anzugeben ausgeführt, wenn die Bedingung erfüllt ist FALSCH.

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
 }

Beispiel

Wenn die Stunde weniger als 18 Uhr beträgt, erstellen Sie ein „Guten Tag“ Begrüßung, sonst „Guten Abend“:

if (hour < 18) {
    greeting = "Good day";
 }
else {
    greeting = "Good evening";
 }

Das Ergebnis der Begrüßung wird sein:

Probieren Sie es selbst aus →

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

Die else if-Anweisung

Verwenden Sie die Anweisung else if, um eine neue Bedingung anzugeben, wenn die erste Bedingung falsch ist.

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
 }

Beispiel

Wenn die Zeit weniger als 10:00 Uhr beträgt, erstellen Sie ein „Gut“. Morgen" Begrüßung, wenn nicht, aber die Zeit ist weniger als 20:00 Uhr, erstellen Sie eine „Guten Tag“-Begrüßung, ansonsten ein „Guten Abend“:

if (time < 10) {
    greeting = "Good morning";
 }
else if (time < 20) {
    greeting = "Good day";
 }
else {
    greeting = "Good evening";
 }

Das Ergebnis der Begrüßung wird sein:

Probieren Sie es selbst aus →

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

Mehr Beispiele

Zufälliger Link

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