• Zurück
• Weiter

JavaScript unterstützt einen kompakten Satz von Anweisungen, insbesondere Kontrollflussanweisungen, die Sie verwenden können, um eine große Menge an Interaktivität in Ihrer Anwendung zu integrieren. Dieses Kapitel bietet einen Überblick über diese Anweisungen.

DieJavaScript-Referenz enthält umfassende Informationen über die Anweisungen in diesem Kapitel. Das Semikolon (;) wird verwendet, um Anweisungen im JavaScript-Code zu trennen.

Jeder JavaScript-Ausdruck ist auch eine Anweisung. SieheAusdrücke und Operatoren für vollständige Informationen über Ausdrücke.

Block-Anweisung

Die grundlegendste Anweisung ist eineBlock-Anweisung, die dazu verwendet wird, Anweisungen zu gruppieren. Der Block wird durch ein Paar geschweifter Klammern begrenzt:

{  statement1;  statement2;  // …  statementN;}

Beispiel

Block-Anweisungen werden häufig mit Kontrollflussanweisungen (if,for,while) verwendet.

while (x < 10) {  x++;}

Hier ist{ x++; } die Block-Anweisung.

var x = 1;{  var x = 2;}console.log(x); // 2

Bedingte Anweisungen

Eine bedingte Anweisung ist eine Reihe von Befehlen, die ausgeführt werden, wenn eine festgelegte Bedingung zutrifft. JavaScript unterstützt zwei bedingte Anweisungen:if...else undswitch.

if...else-Anweisung

Verwenden Sie dieif-Anweisung, um eine Anweisung auszuführen, wenn eine logische Bedingungtrue ist. Verwenden Sie die optionaleelse-Klausel, um eine Anweisung auszuführen, wenn die Bedingungfalse ist.

Eineif-Anweisung sieht so aus:

if (condition) {  statement1;} else {  statement2;}

Hier kann diecondition jeder Ausdruck sein, der zutrue oderfalse ausgewertet wird. (SieheBoolean für eine Erklärung, was zutrue undfalse ausgewertet wird.)

Wenncondition zutrue ausgewertet wird, wirdstatement1 ausgeführt. Andernfalls wirdstatement2 ausgeführt.statement1 undstatement2 können jede Anweisung sein, einschließlich weiterer geschachtelterif-Anweisungen.

Sie können die Anweisungen auch mitelse if kombinieren, um mehrere Bedingungen in Folge zu testen, wie folgt:

if (condition1) {  statement1;} else if (condition2) {  statement2;} else if (conditionN) {  statementN;} else {  statementLast;}

Bei mehreren Bedingungen wird nur die erste logische Bedingung ausgeführt, die zutrue ausgewertet wird. Um mehrere Anweisungen auszuführen, gruppieren Sie sie in einer Block-Anweisung ({ /* … */ }).

Beste Praxis

Im Allgemeinen ist es eine gute Praxis, immer Block-Anweisungen zu verwenden,insbesondere wennif-Anweisungen geschachtelt werden:

if (condition) {  // Statements for when condition is true  // …} else {  // Statements for when condition is false  // …}

Im Allgemeinen ist es eine gute Praxis, keinif...else mit einer Zuweisung wiex = y als Bedingung zu haben:

if (x = y) {  // statements here}

In dem seltenen Fall, dass Sie etwas Derartiges tun möchten, hat diewhile-Dokumentation einen AbschnittVerwendung einer Zuweisung als Bedingung mit Anleitungen zu einer allgemeinen Best-Practice-Syntax, die Sie kennen und befolgen sollten.

Falsy-Werte

Die folgenden Werte werden zufalse ausgewertet (auch bekannt alsFalsy Werte):

• false
• undefined
• null
• 0
• NaN
• der leere String ("")

Alle anderen Werte—einschließlich aller Objekte—werden zutrue ausgewertet, wenn sie an eine bedingte Anweisung übergeben werden.

const b = new Boolean(false);if (b) {  // diese Bedingung wird zu true ausgewertet}if (b == true) {  // diese Bedingung wird zu false ausgewertet}

Beispiel

Im folgenden Beispiel gibt die FunktioncheckDatatrue zurück, wenn die Anzahl der Zeichen in einemText-Objekt drei beträgt. Andernfalls wird eine Meldung angezeigt und es wirdfalse zurückgegeben.

function checkData() {  if (document.form1.threeChar.value.length === 3) {    return true;  }  alert(    `Enter exactly three characters. ${document.form1.threeChar.value} is not valid.`,  );  return false;}

switch-Anweisung

Eineswitch-Anweisung ermöglicht es einem Programm, einen Ausdruck zu evaluieren und zu versuchen, den Wert des Ausdrucks mit einemcase-Label abzugleichen. Wenn eine Übereinstimmung gefunden wird, führt das Programm die zugehörige Anweisung aus.

Eineswitch-Anweisung sieht so aus:

switch (expression) {  case label1:    statements1;    break;  case label2:    statements2;    break;  // …  default:    statementsDefault;}

JavaScript wertet die obigeswitch-Anweisung wie folgt aus:

• Das Programm sucht zuerst nach einercase-Klausel mit einem Label, das mit dem Wert vonexpression übereinstimmt, und überträgt dann die Kontrolle auf diese Klausel, wobei die zugehörigen Anweisungen ausgeführt werden.
• Wenn kein übereinstimmendes Label gefunden wird, sucht das Programm nach der optionalendefault-Klausel:
  • Wenn einedefault-Klausel gefunden wird, überträgt das Programm die Kontrolle auf diese Klausel und führt die zugehörigen Anweisungen aus.
  • Wenn keinedefault-Klausel gefunden wird, setzt das Programm die Ausführung bei der Anweisung nach dem Ende vonswitch fort.
  • (Konventionell wird diedefault-Klausel als letzte Klausel geschrieben, sie muss jedoch nicht so sein.)

break-Anweisungen

Die optionalebreak-Anweisung, die jedercase-Klausel zugeordnet ist, stellt sicher, dass das Programm ausswitch ausschert, sobald die übereinstimmende Anweisung ausgeführt wurde, und dann die Ausführung bei der Anweisung nachswitch fortsetzt. Wennbreak weggelassen wird, setzt das Programm die Ausführung innerhalb derswitch-Anweisung fort (und wird die Anweisungen unter dem nächstencase und so weiter ausführen).

Beispiel

Im folgenden Beispiel, wennfruitType mit"Bananas" übereinstimmt, wird das Programm den Wert mitcase "Bananas" abgleichen und die zugehörige Anweisung ausführen. Wennbreak angetroffen wird, verlässt das Programm dieswitch und setzt die Ausführung ab der Anweisung nachswitch fort. Wennbreak weggelassen würde, würde die Anweisung fürcase "Cherries" ebenfalls ausgeführt.

switch (fruitType) {  case "Oranges":    console.log("Oranges are $0.59 a pound.");    break;  case "Apples":    console.log("Apples are $0.32 a pound.");    break;  case "Bananas":    console.log("Bananas are $0.48 a pound.");    break;  case "Cherries":    console.log("Cherries are $3.00 a pound.");    break;  case "Mangoes":    console.log("Mangoes are $0.56 a pound.");    break;  case "Papayas":    console.log("Papayas are $2.79 a pound.");    break;  default:    console.log(`Sorry, we are out of ${fruitType}.`);}console.log("Is there anything else you'd like?");

Anweisungen zur Ausnahmebehandlung

Sie können Ausnahmen mit derthrow-Anweisung auslösen und sie mit dentry...catch-Anweisungen behandeln.

• throw-Anweisung
• try...catch-Anweisung

Ausnahmetypen

Fast jedes Objekt kann in JavaScript geworfen werden. Dennoch sind nicht alle geworfenen Objekte gleich. Während es üblich ist, Zahlen oder Zeichenfolgen als Fehler zu werfen, ist es häufig effektiver, eine der speziell für diesen Zweck erstellten Ausnahmetypen zu verwenden:

• ECMAScript-Ausnahmen
• DOMException

throw-Anweisung

Verwenden Sie diethrow-Anweisung, um eine Ausnahme auszulösen. Einethrow-Anweisung gibt den zu werfenden Wert an:

throw expression;

Sie können jeden Ausdruck werfen, nicht nur Ausdrücke eines bestimmten Typs. Der folgende Code wirft mehrere Ausnahmen verschiedener Typen:

throw "Error2"; // String typethrow 42; // Number typethrow true; // Boolean typethrow {  toString() {    return "I'm an object!";  },};

try...catch-Anweisung

Dietry...catch-Anweisung markiert einen Block von Anweisungen zum Ausprobieren und gibt eine oder mehrere Antworten an, falls eine Ausnahme ausgelöst wird. Wenn eine Ausnahme ausgelöst wird, fängt dietry...catch-Anweisung sie ab.

Dietry...catch-Anweisung besteht aus einemtry-Block, der eine oder mehrere Anweisungen enthält, sowie einemcatch-Block, der Anweisungen enthält, die angeben, was zu tun ist, wenn imtry-Block eine Ausnahme ausgelöst wird.

Mit anderen Worten, Sie möchten, dass dertry-Block erfolgreich ist—wenn er jedoch nicht erfolgreich ist, möchten Sie, dass die Kontrolle auf dencatch-Block übergeht. Wenn imtry-Block (oder in einer Funktion, die aus demtry-Block aufgerufen wird) eine Ausnahme ausgelöst wird, wechselt die Kontrollesofort in dencatch-Block. Wenn imtry-Block keine Ausnahme ausgelöst wird, wird dercatch-Block übersprungen. Derfinally-Block wird nach dentry- undcatch-Blöcken, jedoch vor den Anweisungen nach dertry...catch-Anweisung ausgeführt.

Das folgende Beispiel verwendet einetry...catch-Anweisung. Das Beispiel ruft eine Funktion auf, die einen Monatsnamen aus einem Array basierend auf dem übergebenen Wert abruft. Wenn der Wert keiner Monatsnummer (1 –12) entspricht, wird eine Ausnahme mit dem Wert'Ungültiger Monatscode' ausgelöst, und die Anweisungen imcatch-Block setzen diemonthName-Variable auf'unbekannt'.

function getMonthName(mo) {  mo--; // Adjust month number for array index (so that 0 = Jan, 11 = Dec)  // prettier-ignore  const months = [    "Jan", "Feb", "Mar", "Apr", "May", "Jun",    "Jul", "Aug", "Sep", "Oct", "Nov", "Dec",  ];  if (!months[mo]) {    throw new Error("Invalid month code"); // throw keyword is used here  }  return months[mo];}try {  // statements to try  monthName = getMonthName(myMonth); // function could throw exception} catch (e) {  monthName = "unknown";  logMyErrors(e); // pass exception object to error handler (i.e. your own function)}

Der catch-Block

Sie können einencatch-Block verwenden, um alle Ausnahmen zu behandeln, die möglicherweise imtry-Block generiert werden.

catch (exception) {  statements}

Dercatch-Block gibt einen Bezeichner an (exception im vorhergehenden Beispiel), der den vomthrow-Statement angegebenen Wert hält. Sie können diesen Bezeichner verwenden, um Informationen über die geworfene Ausnahme zu erhalten.

JavaScript erstellt diesen Bezeichner, wenn dercatch-Block betreten wird. Der Bezeichner existiert nur für die Dauer descatch-Blocks. Wenn dercatch-Block die Ausführung beendet hat, existiert der Bezeichner nicht mehr.

Zum Beispiel wirft der folgende Code eine Ausnahme. Wenn die Ausnahme auftritt, wechselt die Kontrolle in dencatch-Block.

try {  throw "myException"; // generates an exception} catch (err) {  // statements to handle any exceptions  logMyErrors(err); // pass exception object to error handler}

Der finally-Block

Derfinally-Block enthält Anweisungen, dienach dentry- undcatch-Blöcken ausgeführt werden. Zusätzlich wird derfinally-Blockvor dem Code ausgeführt, der dertry...catch...finally-Anweisung folgt.

Es ist auch wichtig zu beachten, dass derfinally-Blockunabhängig davon, ob eine Ausnahme ausgelöst wird, ausgeführt wird. Wenn eine Ausnahme ausgelöst wird, werden die Anweisungen imfinally-Block dennoch ausgeführt, selbst wenn keincatch-Block die ausgelöste Ausnahme behandelt.

Sie können denfinally-Block verwenden, um Ihr Skript bei Auftreten einer Ausnahme sanft fehlschlagen zu lassen. Beispielsweise müssen Sie möglicherweise eine Ressource freigeben, die Ihr Skript gebunden hat.

Im folgenden Beispiel wird eine Datei geöffnet und dann werden Anweisungen ausgeführt, die die Datei verwenden. (Serverseitiges JavaScript erlaubt Ihnen den Zugriff auf Dateien.) Wenn während der Datei geöffnet ist, eine Ausnahme ausgelöst wird, schließt derfinally-Block die Datei, bevor das Skript fehlschlägt. Die Verwendung vonfinally stellt hiersicher, dass die Datei niemals offen bleibt, selbst wenn ein Fehler auftritt.

openMyFile();try {  writeMyFile(theData); // This may throw an error} catch (e) {  handleError(e); // If an error occurred, handle it} finally {  closeMyFile(); // Always close the resource}

Wenn derfinally-Block einen Wert zurückgibt, wird dieser Wert zum Rückgabewert der gesamtentry...catch...finally-Produktion, unabhängig vonreturn-Anweisungen in dentry- undcatch-Blöcken:

function f() {  try {    console.log(0);    throw "bogus";  } catch (e) {    console.log(1);    // This return statement is suspended    // until finally block has completed    return true;    console.log(2); // not reachable  } finally {    console.log(3);    return false; // overwrites the previous "return"    // `f` exits here    console.log(4); // not reachable  }  console.log(5); // not reachable}console.log(f()); // 0, 1, 3, false

Das Überschreiben von Rückgabewerten durch denfinally-Block gilt auch für Ausnahmen, die imcatch-Block ausgelöst oder erneut ausgelöst werden:

function f() {  try {    throw "bogus";  } catch (e) {    console.log('caught inner "bogus"');    // This throw statement is suspended until    // finally block has completed    throw e;  } finally {    return false; // overwrites the previous "throw"    // `f` exits here  }}try {  console.log(f());} catch (e) {  // this is never reached!  // while f() executes, the `finally` block returns false,  // which overwrites the `throw` inside the above `catch`  console.log('caught outer "bogus"');}// Logs:// caught inner "bogus"// false

Verschachtelung von try...catch-Anweisungen

Sie können eine oder mehreretry...catch-Anweisungen verschachteln.

Wenn ein innerertry-Blockkeinen entsprechendencatch-Block hat:

1. muss ereinenfinally-Block enthalten, und
2. dercatch-Block der umgebendentry...catch-Anweisung wirdauf eine Übereinstimmung geprüft.

Für weitere Informationen sieheverschachtelte try-Blöcke auf dertry...catch-Referenzseite.

Nutzung von Error-Objekten

Abhängig von der Art des Fehlers können Sie möglicherweise diename- undmessage-Eigenschaften verwenden, um eine genauere Nachricht zu erhalten.

Diename-Eigenschaft gibt die allgemeine Klasse desError an (wieDOMException oderError), währendmessage normalerweise eine kürzere Nachricht bietet als die, die man erhält, indem man das Error-Objekt in einen String konvertiert.

Wenn Sie Ihre eigenen Ausnahmen werfen, um diese Eigenschaften zu nutzen (zum Beispiel, wenn Ihrcatch-Block nicht zwischen Ihren eigenen Ausnahmen und Systemausnahmen unterscheidet), können Sie denError-Konstruktor verwenden.

Zum Beispiel:

function doSomethingErrorProne() {  if (ourCodeMakesAMistake()) {    throw new Error("The message");  }  doSomethingToGetAJavaScriptError();}try {  doSomethingErrorProne();} catch (e) {  // Now, we actually use `console.error()`  console.error(e.name); // 'Error'  console.error(e.message); // 'The message', or a JavaScript error message}

• Zurück
• Weiter