Anweisungen (Kontrollfluss)

  • Adressname der Version: JavaScript/Guide/Statements
  • Titel der Version: Anweisungen
  • ID der Version: 317889
  • Erstellt:
  • Autor: eminor
  • Aktuelle Version? Nein
  • Kommentar

Inhalt der Version

JavaScript unterstützt einen kompakten Satz von Anweisungen, die eingesetzt werden können, um Websites interaktiv zu gestalten. Dieses Kapitel bietet eine Übersicht zu diesen Anweisungen.

Jeder Ausdruck ist auch eine Anweisung. Das Kapitel Ausdrücke und Operatoren stellt hierzu mehr Informationen bereit.

Zur Trennung von Anweisungen wird das Semikolon (;) verwendet. Die JavaScript Referenz informiert darüber genauer.

Blockstruktur

Anweisungen werden mit Anweisungsblöcken gruppiert. Ein Anweisungsblock wird mit geschweifte Klammern festgelegt:

{
   Anweisung_1;
   Anweisung_2;
   .
   .
   .
   Anweisung_n;
}

Beispiel
Anweisungsblöcke werden vorwiegend in Verbindung mit Anweisungen zur Flusskontrolle eingesetzt (z. B. if, for, while).

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

Bei diesem Beispiel ist { x++; } der Anweisungsblock.

Wichtig: JavaScript grenzt die Sichtbarkeit (Scope) von Blöcken nicht ab. Variablen, die innerhalb eines Blocks deklariert werden, sind innerhalb der Funktion oder des Skripts sichtbar und bleiben auch innerhalb dieses Bereichs erhalten. Mit anderen Worten: Anweisungsblöcke erzeugen keinen seperaten Sichtbarkeitsbereich. Obgleich es auch eigenständige Blockanweisungen (standalone) gibt und diese zur Syntax gehören, sollte man auf deren Einsatz besser verzichten, da sie nicht auf dieselbe Weise funktionieren wie z. B. bei C oder Java.

Beispiel:

var x = 1;
{
  var x = 2;
}
alert(x); // Ausgabe: 2

Die Ausgabe ist hier "2", weil sich die Anweisung "var x" innerhalb des Blocks im selben Sichtbarkeitsbereich befindet, wie die andere "var x"- Anweisung, die vor dem Block steht. Bei C oder Java wäre die Ausgabe "1".

Bedingte Anweisungen

Eine bedingte Anweisung ist ein Satz von Befehlen, die ausgeführt werden, wenn eine bestimmte festgelegte Bedingung erfüllt ist. JavaScript kennt hierfür zwei verschiedene Anweisungen: if...else und switch.

if...else Anweisung

Die if Anweisung sollte eingesetzt werden, wenn bestimmte Anweisungen ausgeführt werden sollen, falls eine logische Bedingungen erfüllt ist. Ferner kann ein optionaler else-Abschnitt festgelegt werden, dessen Anweisungen ausgeführt werden, falls die Bedingung nicht erfüllt ist. Die Syntax einer if Anweisung ist wie folgt:

if (Bedingung)
  Anweisung_1
[else
  Anweisung_2]

Anweisung kann jeder Ausdruck sein, der zu true oder false evaluiert. Wenn die Bedingung zu true evaluiert, wird Anweisung_1 ausgeführt, andernfalls wird Anweisung_2 ausgeführt. Anweisung_1 und Anweisung_2 können für beliebige Anweisungen stehen, auch weitere verschachtelte if Anweisungen könnten an dieser Stelle eingesetzt werden.

Darüber hinaus ist es mit Hilfe von else if möglich mehrere Bedingungen nacheinander zu überprüfen (Verzweigung):  

if (Bedingung)
  Anweisung_1
[else if (Bedingung_2)
  Anweisung_2]
...
[else if (Bedingung_n_1)
  Anweisung_n_1]
[else
  Anweisung_n]

Sollen mehrere Anweisungen ausgeführt werden, müssen sie innerhalb eines Anweisungsblocks ({ ... }) stehen. Es ist gute Praxis die Blöcke immer anzugeben, auch wenn sie für einzelne Anweisungen nicht zwingend notwendig sind. Insbesondere bei verschachtelten if Anweisungen wird hierdurch die Lesbarkeit verbessert.

if (condition) {
  statements_1
} else {
  statements_2
}

Außerdem ist es empfehlenswert keine Zuweisungen an der Stelle für die Bedingung vorzunehmen, weil diese aufgrund des Gleichzeichens leicht mit Vergleichen verwechselt werden können. Der folgende Code sollte also nicht verwendet werden:

if (x = y) {
  /* do the right thing */
}

Wenn man eine Zuweisung in einem bedingten Ausdruck angeben möchte, ist es gängige Praxis diese in zusätzliche Klammern einzuschließen. Zum Beispiel:

if ((x = y)) {
  /* mach das Richtige */
}

Die folgenden Werte evaluieren zu false:

  • false
  • undefined
  • null
  • 0
  • NaN
  • the empty string ("")

Alle anderen Werte, einschließlich aller Objekte, evaluieren zu true, wenn sie als Bedingung angegeben werden.

Vorsicht: Die primitiven booleschen Werte wie true und false sollten nicht mit den Werten true und false des booleschen Objekts (Boolean) verwechselt werden. Zum Beispiel:

var b = new Boolean(false);
if (b) // diese Bedingung evaluiert zu true

Beispiel

Beim folgenden Beispiel liefert die Funktion checkData true, wenn die Anzahl der Zeichen eines Text-Objekts "3" ist. Andernfalls wird eine Alarm-Nachricht gezeigt und false zurückgegeben.

function checkData() {
  if (document.form1.threeChar.value.length == 3) {
    return true;
  } else {
    alert("Bitte genau 3 Zeichen eingeben. " +
      document.form1.threeChar.value + " is not valid.");
    return false;
  }
}

switch Anweisung

Eine switch Anweisung erlaubt einem Skript einen Ausdruck auszuwerten und das Ergebnis mit den Ausdrücken der case-Labels zu vergleichen (Fallunterscheidung). Stimmt das Ergebnis überein, werden die entsprechenden Anweisungen ausgeführt.

Beispiel:

switch (Ausdruck) {
   case label_1:
      Anweisung_1
      [break;]
   case label_2:
      Anweisung_2
      [break;]
   ...
   default:
      Anweisung_falls_keine_case_Ausdruck_passt
      [break;]
}

Bei diesem Skript wird zuerst nach einem case-Abschnitt gesucht, dessen Wert mit dem Wert des in Klammern spezifizierten Ausdrucks übereinstimmt. Wird ein solcher Wert gefunden, werden die Anweisungen des case-Blocks ausgeführt. Sollte keiner der Werte mit dem Wert des Ausdrucks übereinstimmen, wird nach einem default-Abschnitt gesucht und falls vorhanden, die Kontrolle an diesen übergeben und die entsprechenden Anweisungen ausgeführt. Falls kein default-Abschnitt vorhanden ist, wird die Ausführung hinter der switch-Anweisung fortgesetzt. Der Konvention nach sollte der default-Abschnitt an letzter Stelle stehen, jedoch ist die Angabe keine Pflicht.

 

The optional break statement associated with each case clause ensures that the program breaks out of switch once the matched statement is executed and continues execution at the statement following switch. If break is omitted, the program continues execution at the next statement in the switch statement.

Example
In the following example, if fruittype evaluates to "Bananas", the program matches the value with case "Bananas" and executes the associated statement. When break is encountered, the program terminates switch and executes the statement following switch. If break were omitted, the statement for case "Cherries" would also be executed.

switch (fruittype) {
   case "Oranges":
      document.write("Oranges are $0.59 a pound.<br>");
      break;
   case "Apples":
      document.write("Apples are $0.32 a pound.<br>");
      break;
   case "Bananas":
      document.write("Bananas are $0.48 a pound.<br>");
      break;
   case "Cherries":
      document.write("Cherries are $3.00 a pound.<br>");
      break;
   case "Mangoes":
   case "Papayas":
      document.write("Mangoes and papayas are $2.79 a pound.<br>");
      break;
   default:
      document.write("Sorry, we are out of " + fruittype + ".<br>");
}
document.write("Is there anything else you'd like?<br>");

Loop Statements

A loop is a set of commands that executes repeatedly until a specified condition is met. JavaScript supports the for, do while, and while loop statements, as well as label (label is not itself a looping statement, but is frequently used with these statements). In addition, you can use the break and continue statements within loop statements.

Another statement, for...in, executes statements repeatedly but is used for object manipulation. See {{ linkToFragment("Object Manipulation Statements") }}.

The loop statements are:

  • {{ linkToFragment("for Statement") }}
  • {{ linkToFragment("do...while Statement") }}
  • {{ linkToFragment("while Statement") }}
  • {{ linkToFragment("label Statement") }}
  • {{ linkToFragment("break Statement") }}
  • {{ linkToFragment("continue Statement") }}

for Statement

A for loop repeats until a specified condition evaluates to false. The JavaScript for loop is similar to the Java and C for loop. A for statement looks as follows:

for ([initialExpression]; [condition]; [incrementExpression])
   statement

When a for loop executes, the following occurs:

  1. The initializing expression initialExpression, if any, is executed. This expression usually initializes one or more loop counters, but the syntax allows an expression of any degree of complexity. This expression can also declare variables.
  2. The condition expression is evaluated. If the value of condition is true, the loop statements execute. If the value of condition is false, the for loop terminates. If the condition expression is omitted entirely, the condition is assumed to be true.
  3. The statement executes. To execute multiple statements, use a block statement ({ ... }) to group those statements.
  4. The update expression incrementExpression, if there is one, executes, and control returns to step 2.

Example
The following function contains a for statement that counts the number of selected options in a scrolling list (a Select object that allows multiple selections). The for statement declares the variable i and initializes it to zero. It checks that i is less than the number of options in the Select object, performs the succeeding if statement, and increments i by one after each pass through the loop.

<script type="text/javascript">

function howMany(selectObject) {
   var numberSelected = 0;
   for (var i = 0; i < selectObject.options.length; i++) {
      if (selectObject.options[i].selected)
         numberSelected++;
   }
   return numberSelected;
}

</script>
<form name="selectForm">
   <p>
      <strong>Choose some music types, then click the button below:</strong>
      <br/>
      <select name="musicTypes" multiple="multiple">
         <option selected="selected">R&B</option>
         <option>Jazz</option>
         <option>Blues</option>
         <option>New Age</option>
         <option>Classical</option>
         <option>Opera</option>
      </select>
   </p>
   <p>
      <input type="button" value="How many are selected?"
         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/>
   </p>
</form>

do...while Statement

The do...while statement repeats until a specified condition evaluates to false. A do...while statement looks as follows:

do
   statement
while (condition);

statement executes once before the condition is checked. To execute multiple statements, use a block statement ({ ... }) to group those statements. If condition is true, the statement executes again. At the end of every execution, the condition is checked. When the condition is false, execution stops and control passes to the statement following do...while.

Example
In the following example, the do loop iterates at least once and reiterates until i is no longer less than 5.

do {
   i += 1;
   document.write(i);
} while (i < 5);

while Statement

A while statement executes its statements as long as a specified condition evaluates to true. A while statement looks as follows:

while (condition)
   statement

If the condition becomes false, statement within the loop stops executing and control passes to the statement following the loop.

The condition test occurs before statement in the loop are executed. If the condition returns true, statement is executed and the condition is tested again. If the condition returns false, execution stops and control is passed to the statement following while.

To execute multiple statements, use a block statement ({ ... }) to group those statements.

Example 1
The following while loop iterates as long as n is less than three:

n = 0;
x = 0;
while (n < 3) {
   n++;
   x += n;
}

With each iteration, the loop increments n and adds that value to x. Therefore, x and n take on the following values:

  • After the first pass: n = 1 and x = 1
  • After the second pass: n = 2 and x = 3
  • After the third pass: n = 3 and x = 6

After completing the third pass, the condition n < 3 is no longer true, so the loop terminates.

Example 2
Avoid infinite loops. Make sure the condition in a loop eventually becomes false; otherwise, the loop will never terminate. The statements in the following while loop execute forever because the condition never becomes false:

while (true) {
   alert("Hello, world");
}

label Statement

A label provides a statement with an identifier that lets you refer to it elsewhere in your program. For example, you can use a label to identify a loop, and then use the break or continue statements to indicate whether a program should interrupt the loop or continue its execution.

The syntax of the label statement looks like the following:

label :
   statement

The value of label may be any JavaScript identifier that is not a reserved word. The statement that you identify with a label may be any statement.

Example
In this example, the label markLoop identifies a while loop.

markLoop:
while (theMark == true) {
   doSomething();
}

break Statement

Use the break statement to terminate a loop, switch, or in conjunction with a label statement.

  • When you use break without a label, it terminates the innermost enclosing while, do-while, for, or switch immediately and transfers control to the following statement.
  • When you use break with a label, it terminates the specified labeled statement.

The syntax of the break statement looks like this:

  1. break;
  2. break label;

The first form of the syntax terminates the innermost enclosing loop or switch; the second form of the syntax terminates the specified enclosing label statement.

Example 1:
The following example iterates through the elements in an array until it finds the index of an element whose value is theValue:

for (i = 0; i < a.length; i++) {
   if (a[i] == theValue)
      break;
}

Example 2: Breaking to a Label

var x = 0;
var z = 0
labelCancelLoops: while (true) {
    console.log("Outer loops: " + x);
    x += 1;
    z = 1;
    while (true) {
        console.log("Inner loops: " + z);
        z += 1;
        if (z === 10 && x === 10) {
            break labelCancelLoops;
        } else if (z === 10) {
            break;
        }
    }
}

continue Statement

The continue statement can be used to restart a while, do-while, for, or label statement.

  • When you use continue without a label, it terminates the current iteration of the innermost enclosing while, do-while or for statement and continues execution of the loop with the next iteration. In contrast to the break statement, continue does not terminate the execution of the loop entirely. In a while loop, it jumps back to the condition. In a for loop, it jumps to the increment-expression.
  • When you use continue with a label, it applies to the looping statement identified with that label.

The syntax of the continue statement looks like the following:

  1. continue
  2. continue label

Example 1
The following example shows a while loop with a continue statement that executes when the value of i is three. Thus, n takes on the values one, three, seven, and twelve.

i = 0;
n = 0;
while (i < 5) {
   i++;
   if (i == 3)
      continue;
   n += i;
}

Example 2
A statement labeled checkiandj contains a statement labeled checkj. If continue is encountered, the program terminates the current iteration of checkj and begins the next iteration. Each time continue is encountered, checkj reiterates until its condition returns false. When false is returned, the remainder of the checkiandj statement is completed, and checkiandj reiterates until its condition returns false. When false is returned, the program continues at the statement following checkiandj.

If continue had a label of checkiandj, the program would continue at the top of the checkiandj statement.

checkiandj :
   while (i < 4) {
      document.write(i + "<br/>");
      i += 1;
      checkj :
         while (j > 4) {
            document.write(j + "<br/>");
            j -= 1;
            if ((j % 2) == 0)
               continue checkj;
            document.write(j + " is odd.<br/>");
         }
      document.write("i = " + i + "<br/>");
      document.write("j = " + j + "<br/>");
   }

Object Manipulation Statements

JavaScript uses the for...in, for each...in, and with statements to manipulate objects.

for...in Statement

The for...in statement iterates a specified variable over all the properties of an object. For each distinct property, JavaScript executes the specified statements. A for...in statement looks as follows:

for (variable in object) {
   statements
}

Example
The following function takes as its argument an object and the object's name. It then iterates over all the object's properties and returns a string that lists the property names and their values.

function dump_props(obj, obj_name) {
   var result = "";
   for (var i in obj) {
      result += obj_name + "." + i + " = " + obj[i] + "<br>";
   }
   result += "<hr>";
   return result;
}

For an object car with properties make and model, result would be:

car.make = Ford
car.model = Mustang

Arrays
Although it may be tempting to use this as a way to iterate over Array elements, because the for...in statement iterates over user-defined properties in addition to the array elements, if you modify the Array object, such as adding custom properties or methods, the for...in statement will return the name of your user-defined properties in addition to the numeric indexes. Thus it is better to use a traditional for loop with a numeric index when iterating over arrays.

for each...in Statement

for each...in is a loop statement introduced in JavaScript 1.6. It is similar to for...in, but iterates over the values of object's properties, not their names.

var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};
for each (var item in obj) {
  sum += item;
}
print(sum); // prints "26", which is 5+13+8

Comments

Comments are author notations that explain what a script does. Comments are ignored by the interpreter. JavaScript supports Java and C++-style comments:

  • Comments on a single line are preceded by a double-slash (//).
  • Comments that span multiple lines are preceded by /* and followed by */:

Example
The following example shows two comments:

// This is a single-line comment.

/* This is a multiple-line comment. It can be of any length, and
you can put whatever you want here. */

Exception Handling Statements

You can throw exceptions using the throw statement and handle them using the try...catch statements.

You can also use the try...catch statement to handle Java exceptions (though there is a {{ bug("391642") }} with this). See Handling Java Exceptions in JavaScript and JavaScript to Java Communication for information.

  • {{ linkToFragment("throw Statement") }}
  • {{ linkToFragment("try...catch Statement") }}

Exception Types

Just about any object can be thrown in JavaScript. Nevertheless, not all thrown objects are created equal. While it is fairly common to throw numbers or strings as errors it is frequently more effective to use one of the exception types specifically created for this purpose:

throw Statement

Use the throw statement to throw an exception. When you throw an exception, you specify the expression containing the value to be thrown:

throw expression;

You may throw any expression, not just expressions of a specific type. The following code throws several exceptions of varying types:

throw "Error2";
throw 42;
throw true;
throw {toString: function() { return "I'm an object!"; } };
Note: You can specify an object when you throw an exception. You can then reference the object's properties in the catch block. The following example creates an object myUserException of type UserException and uses it in a throw statement.
// Create an object type UserException
function UserException (message){
  this.message=message;
  this.name="UserException";
}

// Make the exception convert to a pretty string when used as
// a string (e.g. by the error console)
UserException.prototype.toString = function (){
  return this.name + ': "' + this.message + '"';
}

// Create an instance of the object type and throw it
throw new UserException("Value too high");

try...catch Statement

The try...catch statement marks a block of statements to try, and specifies one or more responses should an exception be thrown. If an exception is thrown, the try...catch statement catches it.

The try...catch statement consists of a try block, which contains one or more statements, and zero or more catch blocks, containing statements that specify what to do if an exception is thrown in the try block. That is, you want the try block to succeed, and if it does not succeed, you want control to pass to the catch block. If any statement within the try block (or in a function called from within the try block) throws an exception, control immediately shifts to the catch block. If no exception is thrown in the try block, the catch block is skipped. The finally block executes after the try and catch blocks execute but before the statements following the try...catch statement.

The following example uses a try...catch statement. The example calls a function that retrieves a month name from an array based on the value passed to the function. If the value does not correspond to a month number (1-12), an exception is thrown with the value "InvalidMonthNo" and the statements in the catch block set the monthName variable to unknown.

function getMonthName (mo) {
    mo=mo-1; // Adjust month number for array index (1=Jan, 12=Dec)
    var months=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul",
          "Aug","Sep","Oct","Nov","Dec");
    if (months[mo] != null) {
       return months[mo]
    } else {
       throw "InvalidMonthNo"
    }
}

try {
// statements to try
    monthName=getMonthName(myMonth) // function could throw exception
}
catch (e) {
    monthName="unknown"
    logMyErrors(e) // pass exception object to error handler
}

The catch Block

You can use a catch block to handle all exceptions that may be generated in the try block.

catch (catchID) {
  statements
}

The catch block specifies an identifier (catchID in the preceding syntax) that holds the value specified by the throw statement; you can use this identifier to get information about the exception that was thrown. JavaScript creates this identifier when the catch block is entered; the identifier lasts only for the duration of the catch block; after the catch block finishes executing, the identifier is no longer available.

For example, the following code throws an exception. When the exception occurs, control transfers to the catch block.

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

The finally Block

The finally block contains statements to execute after the try and catch blocks execute but before the statements following the try...catch statement. The finally block executes whether or not an exception is thrown. If an exception is thrown, the statements in the finally block execute even if no catch block handles the exception.

You can use the finally block to make your script fail gracefully when an exception occurs; for example, you may need to release a resource that your script has tied up. The following example opens a file and then executes statements that use the file (server-side JavaScript allows you to access files). If an exception is thrown while the file is open, the finally block closes the file before the script fails.

openMyFile();
try {
    writeMyFile(theData); //This may throw a error
}catch(e){
    handleError(e); // If we got a error we handle it
}finally {
    closeMyFile(); // always close the resource
}

If the finally block returns a value, this value becomes the return value of the entire try-catch-finally production, regardless of any return statements in the try and catch blocks:

function f() {
    try {
        alert(0);
        throw "bogus";
    } catch(e) {
        alert(1);
        return true; // this return statement is suspended until finally block has completed
        alert(2); // not reachable
    } finally {
        alert(3);
        return false; // overwrites the previous "return"
        alert(4); // not reachable
    }
    // "return false" is executed now
    
    alert(5); // not reachable
}
f(); // alerts 0, 1, 3; returns false

Nesting try...catch Statements

You can nest one or more try...catch statements. If an inner try...catch statement does not have a catch block, the enclosing try...catch statement's catch block is checked for a match.

Utilizing Error objects

Depending on the type of error, you may be able to use the 'name' and 'message' properties to get a more refined message. 'name' provides the general class of Error (e.g., 'DOMException' or 'Error'), while 'message' generally provides a more succinct message than one would get by converting the error object to a string.

If you are throwing your own exceptions, in order to take advantage of these properties (such as if your catch block doesn't discriminate between your own exceptions and system ones), you can use the Error constructor. For example:

function doSomethingErrorProne () {
   if (ourCodeMakesAMistake()) {
      throw (new Error('The message'));
   }
   else {
      doSomethingToGetAJavascriptError();
   }
}
....
try {
   doSomethingErrorProne();
}
catch (e) {
   alert(e.name);// alerts 'Error'
   alert(e.message); // alerts 'The message' or a JavaScript error message)
}

Quelltext der Version

<p>JavaScript unterstützt einen kompakten Satz von Anweisungen, die eingesetzt werden können, um Websites interaktiv zu gestalten. Dieses Kapitel bietet eine Übersicht zu diesen Anweisungen.</p>
<p>Jeder Ausdruck ist auch eine Anweisung. Das Kapitel <a href="/de/JavaScript/javascript_guide/Ausdr%C3%BCcke_und_Operatoren" title="/de/JavaScript/javascript_guide/Ausdr%C3%BCcke_und_Operatoren">Ausdrücke und Operatoren</a> stellt hierzu mehr Informationen bereit.</p>
<p>Zur Trennung von Anweisungen wird das Semikolon (;) verwendet. Die <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements" title="en-US/docs/JavaScript/Reference/Statements">JavaScript Referenz</a> informiert darüber genauer.</p>
<h2 id="Blockstruktur">Blockstruktur</h2>
<p>Anweisungen werden mit Anweisungsblöcken gruppiert. Ein Anweisungsblock wird mit geschweifte Klammern festgelegt:</p>
<div style="margin-right:270px;">
  <pre class="brush: js">
{
   Anweisung_1;
   Anweisung_2;
   .
   .
   .
   Anweisung_n;
}
</pre>
</div>
<p><strong>Beispiel</strong><br />
  Anweisungsblöcke werden vorwiegend in Verbindung mit Anweisungen zur Flusskontrolle eingesetzt (z. B. <code>if</code>, <code>for</code>, <code>while</code>).</p>
<div style="margin-right:270px;">
  <pre class="brush: js">
while (x &lt; 10){
  x++;
}
</pre>
</div>
<p>Bei diesem Beispiel ist <code>{ x++; }</code> der Anweisungsblock.</p>
<p><strong>Wichtig</strong>: JavaScript grenzt die Sichtbarkeit (Scope) von Blöcken <strong>nicht</strong> ab. Variablen, die innerhalb eines Blocks deklariert werden, sind innerhalb der Funktion oder des Skripts sichtbar und bleiben auch innerhalb dieses Bereichs erhalten. Mit anderen Worten: Anweisungsblöcke erzeugen keinen seperaten Sichtbarkeitsbereich. Obgleich es auch eigenständige Blockanweisungen (standalone) gibt und diese zur Syntax gehören, sollte man auf deren Einsatz besser verzichten, da sie nicht auf dieselbe Weise funktionieren wie z. B. bei C oder Java.</p>
<p>Beispiel:</p>
<pre class="brush: js">
var x = 1;
{
  var x = 2;
}
alert(x); // Ausgabe: 2
</pre>
<p>Die Ausgabe ist hier "2", weil sich die Anweisung "var x" innerhalb des Blocks im selben Sichtbarkeitsbereich befindet, wie die andere "var x"- Anweisung, die vor dem Block steht. Bei C oder Java wäre die Ausgabe "1".</p>
<h2 id="Bedingte_Anweisungen">Bedingte Anweisungen</h2>
<p>Eine bedingte Anweisung ist ein Satz von Befehlen, die ausgeführt werden, wenn eine bestimmte festgelegte Bedingung erfüllt ist. JavaScript kennt hierfür zwei verschiedene Anweisungen: <code>if...else</code> und <code>switch</code>.</p>
<h3 id="if...else_Anweisung">if...else Anweisung</h3>
<p>Die <code>if</code> Anweisung sollte eingesetzt werden, wenn bestimmte Anweisungen ausgeführt werden sollen, falls eine logische Bedingungen erfüllt ist. Ferner kann ein optionaler <code>else</code>-Abschnitt festgelegt werden, dessen Anweisungen ausgeführt werden, falls die Bedingung nicht erfüllt ist. Die Syntax einer <code>if</code> Anweisung ist wie folgt:</p>
<pre class="brush: js">
if (Bedingung)
  Anweisung_1
[else
  Anweisung_2]
</pre>
<p><code>Anweisung</code> kann jeder Ausdruck sein, der zu true oder false evaluiert. Wenn die <code>Bedingung</code> zu true evaluiert, wird <code>Anweisung_1</code> ausgeführt, andernfalls wird <code>Anweisung_2</code> ausgeführt. <code>Anweisung_1</code> und<code> Anweisung_2</code> können für beliebige Anweisungen stehen, auch weitere verschachtelte <code>if</code> Anweisungen könnten an dieser Stelle eingesetzt werden.</p>
<p>Darüber hinaus ist es mit Hilfe von <code>else if</code> möglich mehrere Bedingungen nacheinander zu überprüfen (Verzweigung):&nbsp;&nbsp;</p>
<pre class="brush: js">
if (Bedingung)
  Anweisung_1
[else if (Bedingung_2)
  Anweisung_2]
...
[else if (Bedingung_n_1)
  Anweisung_n_1]
[else
  Anweisung_n]
</pre>
<p>Sollen mehrere Anweisungen ausgeführt werden, müssen sie innerhalb eines Anweisungsblocks (<code>{ ... }</code>) stehen. Es ist gute Praxis die Blöcke immer anzugeben, auch wenn sie für einzelne Anweisungen nicht zwingend notwendig sind. Insbesondere bei verschachtelten <code>if</code> Anweisungen wird hierdurch die Lesbarkeit verbessert.</p>
<pre class="brush: js">
if (condition) {
  statements_1
} else {
  statements_2
}
</pre>
<p>Außerdem ist es empfehlenswert keine Zuweisungen an der Stelle für die Bedingung vorzunehmen, weil diese aufgrund des Gleichzeichens leicht mit Vergleichen verwechselt werden können. Der folgende Code sollte also nicht verwendet werden:</p>
<pre class="brush: js">
if (x = y) {
  /* do the right thing */
}
</pre>
<p>Wenn man eine Zuweisung in einem bedingten Ausdruck angeben möchte, ist es gängige Praxis diese in zusätzliche Klammern einzuschließen. Zum Beispiel:</p>
<pre class="brush: js">
if ((x = y)) {
  /* mach das Richtige */
}
</pre>
<p>Die folgenden Werte evaluieren zu false:</p>
<ul>
  <li><code>false</code></li>
  <li><code>undefined</code></li>
  <li><code>null</code></li>
  <li><code>0</code></li>
  <li><code>NaN</code></li>
  <li>the empty string (<code>""</code>)</li>
</ul>
<p>Alle anderen Werte, einschließlich aller Objekte, evaluieren zu true, wenn sie als Bedingung angegeben werden.</p>
<p>Vorsicht: Die primitiven booleschen Werte wie <code>true</code> und <code>false</code> sollten nicht mit den Werten true und false des booleschen Objekts (Boolean) verwechselt werden. Zum Beispiel:</p>
<pre class="brush: js">
var b = new Boolean(false);
if (b) // diese Bedingung evaluiert zu true
</pre>
<p><strong>Beispiel</strong></p>
<p>Beim folgenden Beispiel liefert die Funktion <code>checkData</code> true, wenn die Anzahl der Zeichen eines <code>Text</code>-Objekts "3" ist. Andernfalls wird eine Alarm-Nachricht gezeigt und false zurückgegeben.</p>
<pre class="brush: js">
function checkData() {
  if (document.form1.threeChar.value.length == 3) {
    return true;
  } else {
    alert("Bitte genau 3 Zeichen eingeben. " +
      document.form1.threeChar.value + " is not valid.");
    return false;
  }
}
</pre>
<h3 id="switch_Anweisung">switch Anweisung</h3>
<p>Eine <code>switch</code> Anweisung erlaubt einem Skript einen Ausdruck auszuwerten und das Ergebnis mit den Ausdrücken der case-Labels zu vergleichen (Fallunterscheidung). Stimmt das Ergebnis überein, werden die entsprechenden Anweisungen ausgeführt.</p>
<p>Beispiel:</p>
<pre class="brush: js">
switch (Ausdruck) {
   case label_1:
      Anweisung_1
      [break;]
   case label_2:
      Anweisung_2
      [break;]
   ...
   default:
      Anweisung_falls_keine_case_Ausdruck_passt
      [break;]
}
</pre>
<p>Bei diesem Skript wird zuerst nach einem <code>case</code>-Abschnitt gesucht, dessen Wert mit dem Wert des in Klammern spezifizierten Ausdrucks übereinstimmt. Wird ein solcher Wert gefunden, werden die Anweisungen des <code>case</code>-Blocks ausgeführt. Sollte keiner der Werte mit dem Wert des Ausdrucks übereinstimmen, wird nach einem <code>default</code>-Abschnitt gesucht und falls vorhanden, die Kontrolle an diesen übergeben und die entsprechenden Anweisungen ausgeführt. Falls kein default-Abschnitt vorhanden ist, wird die Ausführung hinter der switch-Anweisung fortgesetzt. Der Konvention nach sollte der default-Abschnitt an letzter Stelle stehen, jedoch ist die Angabe keine Pflicht.</p>
<p>&nbsp;</p>
<p>The optional <code>break</code> statement associated with each <code>case</code> clause ensures that the program breaks out of <code>switch</code> once the matched statement is executed and continues execution at the statement following switch. If <code>break</code> is omitted, the program continues execution at the next statement in the <code>switch</code> statement.</p>
<p><strong>Example</strong><br />
  In the following example, if <code>fruittype</code> evaluates to "Bananas", the program matches the value with case "Bananas" and executes the associated statement. When <code>break</code> is encountered, the program terminates <code>switch</code> and executes the statement following <code>switch</code>. If <code>break</code> were omitted, the statement for case "Cherries" would also be executed.</p>
<pre class="brush: js">
switch (fruittype) {
   case "Oranges":
      document.write("Oranges are $0.59 a pound.&lt;br&gt;");
      break;
   case "Apples":
      document.write("Apples are $0.32 a pound.&lt;br&gt;");
      break;
   case "Bananas":
      document.write("Bananas are $0.48 a pound.&lt;br&gt;");
      break;
   case "Cherries":
      document.write("Cherries are $3.00 a pound.&lt;br&gt;");
      break;
   case "Mangoes":
   case "Papayas":
      document.write("Mangoes and papayas are $2.79 a pound.&lt;br&gt;");
      break;
   default:
      document.write("Sorry, we are out of " + fruittype + ".&lt;br&gt;");
}
document.write("Is there anything else you'd like?&lt;br&gt;");</pre>
<h2 id="Loop_Statements">Loop Statements</h2>
<p>A loop is a set of commands that executes repeatedly until a specified condition is met. JavaScript supports the <code>for</code>, <code>do while</code>, and <code>while</code> loop statements, as well as label (label is not itself a looping statement, but is frequently used with these statements). In addition, you can use the <code>break</code> and <code>continue</code> statements within loop statements.</p>
<p>Another statement, <code>for...in</code>, executes statements repeatedly but is used for object manipulation. See {{ linkToFragment("Object Manipulation Statements") }}.</p>
<p>The loop statements are:</p>
<ul>
  <li>{{ linkToFragment("for Statement") }}</li>
  <li>{{ linkToFragment("do...while Statement") }}</li>
  <li>{{ linkToFragment("while Statement") }}</li>
  <li>{{ linkToFragment("label Statement") }}</li>
  <li>{{ linkToFragment("break Statement") }}</li>
  <li>{{ linkToFragment("continue Statement") }}</li>
</ul>
<h3 id="for_Statement">for Statement</h3>
<p>A <code>for</code> loop repeats until a specified condition evaluates to false. The JavaScript for loop is similar to the Java and C <code>for</code> loop. A <code>for</code> statement looks as follows:</p>
<pre class="brush: js">
for ([initialExpression]; [condition]; [incrementExpression])
   statement
</pre>
<p>When a <code>for</code> loop executes, the following occurs:</p>
<ol>
  <li>The initializing expression <code>initialExpression</code>, if any, is executed. This expression usually initializes one or more loop counters, but the syntax allows an expression of any degree of complexity. This expression can also declare variables.</li>
  <li>The <code>condition</code> expression is evaluated. If the value of <code>condition</code> is true, the loop statements execute. If the value of <code>condition</code> is false, the <code>for</code> loop terminates. If the <code>condition</code> expression is omitted entirely, the condition is assumed to be true.</li>
  <li>The <code>statement</code> executes. To execute multiple statements, use a block statement (<code>{ ... }</code>) to group those statements.</li>
  <li>The update expression <code>incrementExpression</code>, if there is one, executes, and control returns to step 2.</li>
</ol>
<p><strong>Example</strong><br />
  The following function contains a <code>for</code> statement that counts the number of selected options in a scrolling list (a <code>Select</code> object that allows multiple selections). The <code>for</code> statement declares the variable <code>i</code> and initializes it to zero. It checks that <code>i</code> is less than the number of options in the <code>Select</code> object, performs the succeeding <code>if</code> statement, and increments <code>i</code> by one after each pass through the loop.</p>
<pre class="brush: html">
&lt;script type="text/javascript"&gt;

function howMany(selectObject) {
   var numberSelected = 0;
   for (var i = 0; i &lt; selectObject.options.length; i++) {
      if (selectObject.options[i].selected)
         numberSelected++;
   }
   return numberSelected;
}

&lt;/script&gt;
&lt;form name="selectForm"&gt;
   &lt;p&gt;
      &lt;strong&gt;Choose some music types, then click the button below:&lt;/strong&gt;
      &lt;br/&gt;
      &lt;select name="musicTypes" multiple="multiple"&gt;
         &lt;option selected="selected"&gt;R&amp;B&lt;/option&gt;
         &lt;option&gt;Jazz&lt;/option&gt;
         &lt;option&gt;Blues&lt;/option&gt;
         &lt;option&gt;New Age&lt;/option&gt;
         &lt;option&gt;Classical&lt;/option&gt;
         &lt;option&gt;Opera&lt;/option&gt;
      &lt;/select&gt;
   &lt;/p&gt;
   &lt;p&gt;
      &lt;input type="button" value="How many are selected?"
         onclick="alert ('Number of options selected: ' + howMany(document.selectForm.musicTypes))"/&gt;
   &lt;/p&gt;
&lt;/form&gt;</pre>
<h3 id="do...while_Statement">do...while Statement</h3>
<p>The <code>do...while</code> statement repeats until a specified condition evaluates to false. A <code>do...while</code> statement looks as follows:</p>
<pre class="brush: js">
do
   statement
while (condition);
</pre>
<p><code>statement</code> executes once before the condition is checked. To execute multiple statements, use a block statement (<code>{ ... }</code>) to group those statements. If <code>condition</code> is true, the statement executes again. At the end of every execution, the condition is checked. When the condition is false, execution stops and control passes to the statement following <code>do...while</code>.</p>
<p><strong>Example</strong><br />
  In the following example, the <code>do</code> loop iterates at least once and reiterates until i is no longer less than 5.</p>
<pre class="brush: js">
do {
   i += 1;
   document.write(i);
} while (i &lt; 5);</pre>
<h3 id="while_Statement">while Statement</h3>
<p>A <code>while</code> statement executes its statements as long as a specified condition evaluates to true. A <code>while</code> statement looks as follows:</p>
<pre class="brush: js">
while (condition)
   statement
</pre>
<p>If the condition becomes false, <code>statement</code> within the loop stops executing and control passes to the statement following the loop.</p>
<p>The condition test occurs before <code>statement</code> in the loop are executed. If the condition returns true, <code>statement</code> is executed and the condition is tested again. If the condition returns false, execution stops and control is passed to the statement following <code>while</code>.</p>
<p>To execute multiple statements, use a block statement ({ ... }) to group those statements.</p>
<p><strong>Example 1</strong><br />
  The following <code>while</code> loop iterates as long as <code>n</code> is less than three:</p>
<pre class="brush: js">
n = 0;
x = 0;
while (n &lt; 3) {
   n++;
   x += n;
}
</pre>
<p>With each iteration, the loop increments <code>n</code> and adds that value to <code>x</code>. Therefore, <code>x</code> and <code>n</code> take on the following values:</p>
<ul>
  <li>After the first pass: <code>n</code> = 1 and <code>x</code> = 1</li>
  <li>After the second pass: <code>n</code> = 2 and <code>x</code> = 3</li>
  <li>After the third pass: <code>n</code> = 3 and <code>x</code> = 6</li>
</ul>
<p>After completing the third pass, the condition <code>n &lt; 3</code> is no longer true, so the loop terminates.</p>
<p><strong>Example 2</strong><br />
  Avoid infinite loops. Make sure the condition in a loop eventually becomes false; otherwise, the loop will never terminate. The statements in the following <code>while</code> loop execute forever because the condition never becomes false:</p>
<pre class="brush: js">
while (true) {
   alert("Hello, world");
}</pre>
<h3 id="label_Statement">label Statement</h3>
<p>A label provides a statement with an identifier that lets you refer to it elsewhere in your program. For example, you can use a label to identify a loop, and then use the <code>break</code> or <code>continue</code> statements to indicate whether a program should interrupt the loop or continue its execution.</p>
<p>The syntax of the label statement looks like the following:</p>
<pre class="brush: js">
label :
   statement
</pre>
<p>The value of <code><em>label</em></code> may be any JavaScript identifier that is not a reserved word. The <code><em>statement</em></code> that you identify with a label may be any statement.</p>
<p><strong>Example</strong><br />
  In this example, the label <code>markLoop</code> identifies a <code>while</code> loop.</p>
<pre class="brush: js">
markLoop:
while (theMark == true) {
   doSomething();
}</pre>
<h3 id="break_Statement">break Statement</h3>
<p>Use the <code>break</code> statement to terminate a loop, <code>switch</code>, or in conjunction with a label statement.</p>
<ul>
  <li>When you use <code>break</code> without a label, it terminates the innermost enclosing <code>while</code>, <code>do-while</code>, <code>for</code>, or <code>switch</code> immediately and transfers control to the following statement.</li>
  <li>When you use <code>break</code> with a label, it terminates the specified labeled statement.</li>
</ul>
<p>The syntax of the <code>break</code> statement looks like this:</p>
<ol>
  <li><code>break;</code></li>
  <li><code>break <em>label</em>;</code></li>
</ol>
<p>The first form of the syntax terminates the innermost enclosing loop or <code>switch</code>; the second form of the syntax terminates the specified enclosing label statement.</p>
<p><strong>Example</strong> <strong>1:</strong><br />
  The following example iterates through the elements in an array until it finds the index of an element whose value is <code>theValue</code>:</p>
<pre class="brush: js">
for (i = 0; i &lt; a.length; i++) {
   if (a[i] == theValue)
      break;
}</pre>
<p><strong>Example 2: </strong>Breaking to a Label</p>
<pre class="brush: js">
var x = 0;
var z = 0
labelCancelLoops: while (true) {
    console.log("Outer loops: " + x);
    x += 1;
    z = 1;
    while (true) {
        console.log("Inner loops: " + z);
        z += 1;
        if (z === 10 &amp;&amp; x === 10) {
            break labelCancelLoops;
        } else if (z === 10) {
            break;
        }
    }
}
</pre>
<h3 id="continue_Statement">continue Statement</h3>
<p>The <code>continue</code> statement can be used to restart a <code>while</code>, <code>do-while</code>, <code>for</code>, or <code>label</code> statement.</p>
<ul>
  <li>When you use <code>continue</code> without a label, it terminates the current iteration of the innermost enclosing <code>while</code>, <code>do-while</code> or <code>for</code> statement and continues execution of the loop with the next iteration. In contrast to the <code>break</code> statement, <code>continue</code> does not terminate the execution of the loop entirely. In a <code>while</code> loop, it jumps back to the condition. In a <code>for</code> loop, it jumps to the <code>increment-expression</code>.</li>
  <li>When you use <code>continue</code> with a label, it applies to the looping statement identified with that label.</li>
</ul>
<p>The syntax of the <code>continue</code> statement looks like the following:</p>
<ol>
  <li><code>continue</code></li>
  <li><code>continue </code><em><code>label</code></em></li>
</ol>
<p><strong>Example 1</strong><br />
  The following example shows a <code>while</code> loop with a <code>continue</code> statement that executes when the value of <code>i</code> is three. Thus, <code>n</code> takes on the values one, three, seven, and twelve.</p>
<pre class="brush: js">
i = 0;
n = 0;
while (i &lt; 5) {
   i++;
   if (i == 3)
      continue;
   n += i;
}
</pre>
<p><strong>Example 2</strong><br />
  A statement labeled <code>checkiandj</code> contains a statement labeled <code>checkj</code>. If <code>continue</code> is encountered, the program terminates the current iteration of <code>checkj</code> and begins the next iteration. Each time <code>continue</code> is encountered, <code>checkj</code> reiterates until its condition returns <code>false</code>. When <code>false</code> is returned, the remainder of the <code>checkiandj</code> statement is completed, and <code>checkiandj</code> reiterates until its condition returns <code>false</code>. When <code>false</code> is returned, the program continues at the statement following <code>checkiandj</code>.</p>
<p>If <code>continue</code> had a label of <code>checkiandj</code>, the program would continue at the top of the <code>checkiandj</code> statement.</p>
<pre class="brush: js">
checkiandj :
   while (i &lt; 4) {
      document.write(i + "&lt;br/&gt;");
      i += 1;
      checkj :
         while (j &gt; 4) {
            document.write(j + "&lt;br/&gt;");
            j -= 1;
            if ((j % 2) == 0)
               continue checkj;
            document.write(j + " is odd.&lt;br/&gt;");
         }
      document.write("i = " + i + "&lt;br/&gt;");
      document.write("j = " + j + "&lt;br/&gt;");
   }</pre>
<h2 id="Object_Manipulation_Statements">Object Manipulation Statements</h2>
<p>JavaScript uses the <code>for...in</code>, <code>for each...in</code>, and <code>with</code> statements to manipulate objects.</p>
<h3 id="for...in_Statement">for...in Statement</h3>
<p>The <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/for...in" title="en-US/docs/JavaScript/Reference/Statements/for...in"><code>for...in</code></a> statement iterates a specified variable over all the properties of an object. For each distinct property, JavaScript executes the specified statements. A <code>for...in</code> statement looks as follows:</p>
<pre class="brush: js">
for (variable in object) {
   statements
}
</pre>
<p><strong>Example</strong><br />
  The following function takes as its argument an object and the object's name. It then iterates over all the object's properties and returns a string that lists the property names and their values.</p>
<pre class="brush: js">
function dump_props(obj, obj_name) {
   var result = "";
   for (var i in obj) {
      result += obj_name + "." + i + " = " + obj[i] + "&lt;br&gt;";
   }
   result += "&lt;hr&gt;";
   return result;
}
</pre>
<p>For an object <code>car</code> with properties <code>make</code> and <code>model</code>, <code>result</code> would be:</p>
<pre class="brush: js">
car.make = Ford
car.model = Mustang
</pre>
<p><strong>Arrays</strong><br />
  Although it may be tempting to use this as a way to iterate over <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array" title="en-US/docs/JavaScript/Reference/Global Objects/Array">Array</a> elements, because the <strong>for...in</strong> statement iterates over user-defined properties in addition to the array elements, if you modify the Array object, such as adding custom properties or methods, the <strong>for...in</strong> statement will return the name of your user-defined properties in addition to the numeric indexes. Thus it is better to use a traditional <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/for" title="en-US/docs/JavaScript/Reference/Statements/for">for</a> loop with a numeric index when iterating over arrays.</p>
<h3 id="for_each...in_Statement">for each...in Statement</h3>
<p><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Statements/for_each...in" title="en-US/docs/JavaScript/Reference/Statements/for each...in"><code>for each...in</code></a> is a loop statement introduced in <a href="https://developer.mozilla.org/en-US/docs/JavaScript/New_in_JavaScript/1.6" title="en-US/docs/JavaScript/New in JavaScript/1.6">JavaScript 1.6</a>. It is similar to <code>for...in</code>, but iterates over the values of object's properties, not their names.</p>
<pre class="brush: js">
var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};
for each (var item in obj) {
  sum += item;
}
print(sum); // prints "26", which is 5+13+8</pre>
<h2 id="Comments">Comments</h2>
<p>Comments are author notations that explain what a script does. Comments are ignored by the interpreter. JavaScript supports Java and C++-style comments:</p>
<ul>
  <li>Comments on a single line are preceded by a double-slash (//).</li>
  <li>Comments that span multiple lines are preceded by /* and followed by */:</li>
</ul>
<p><strong>Example</strong><br />
  The following example shows two comments:</p>
<pre class="brush: js">
// This is a single-line comment.

/* This is a multiple-line comment. It can be of any length, and
you can put whatever you want here. */</pre>
<h2 id="Exception_Handling_Statements">Exception Handling Statements</h2>
<p>You can throw exceptions using the <code>throw</code> statement and handle them using the <code>try...catch</code> statements.</p>
<p>You can also use the <code>try...catch</code> statement to handle Java exceptions (though there is a {{ bug("391642") }} with this). See <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide/LiveConnect_Overview#Handling_Java_Exceptions_in_JavaScript" title="en-US/docs/JavaScript/Guide/LiveConnect Overview#Handling Java Exceptions in JavaScript">Handling Java Exceptions in JavaScript</a> and <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide/LiveConnect_Overview#JavaScript_to_Java_Communication" title="en-US/docs/JavaScript/Guide/LiveConnect Overview#JavaScript to Java Communication">JavaScript to Java Communication</a> for information.</p>
<ul>
  <li>{{ linkToFragment("throw Statement") }}</li>
  <li>{{ linkToFragment("try...catch Statement") }}</li>
</ul>
<h3 id="Exception_Types">Exception Types</h3>
<p>Just about any object can be thrown in JavaScript. Nevertheless, not all thrown objects are created equal. While it is fairly common to throw numbers or strings as errors it is frequently more effective to use one of the exception types specifically created for this purpose:</p>
<ul>
  <li><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects#Error_constructors">ECMAScript exceptions</a></li>
  <li><a href="https://developer.mozilla.org/en-US/docs/DOM/DOMException" title="en-US/docs/DOM/DOMException">DOMException</a></li>
  <li><a href="https://developer.mozilla.org/en-US/docs/XPCOM_Interface_Reference/nsIXPCException" title="en-US/docs/nsIXPCException">nsIXPCException</a> (<a href="https://developer.mozilla.org/en-US/docs/XPConnect" title="en-US/docs/XPConnect">XPConnect</a>)</li>
</ul>
<h3 id="throw_Statement">throw Statement</h3>
<p>Use the <code>throw</code> statement to throw an exception. When you throw an exception, you specify the expression containing the value to be thrown:</p>
<pre class="brush: js">
throw expression;
</pre>
<p>You may throw any expression, not just expressions of a specific type. The following code throws several exceptions of varying types:</p>
<pre class="brush: js">
throw "Error2";
throw 42;
throw true;
throw {toString: function() { return "I'm an object!"; } };
</pre>
<div class="note">
  <strong>Note:</strong> You can specify an object when you throw an exception. You can then reference the object's properties in the <code>catch</code> block. The following example creates an object <code>myUserException</code> of type <code>UserException</code> and uses it in a throw statement.</div>
<pre class="brush: js">
// Create an object type UserException
function UserException (message){
  this.message=message;
  this.name="UserException";
}

// Make the exception convert to a pretty string when used as
// a string (e.g. by the error console)
UserException.prototype.toString = function (){
  return this.name + ': "' + this.message + '"';
}

// Create an instance of the object type and throw it
throw new UserException("Value too high");</pre>
<h3 id="try...catch_Statement">try...catch Statement</h3>
<p>The <code>try...catch</code> statement marks a block of statements to try, and specifies one or more responses should an exception be thrown. If an exception is thrown, the <code>try...catch</code> statement catches it.</p>
<p>The <code>try...catch</code> statement consists of a <code>try</code> block, which contains one or more statements, and zero or more <code>catch</code> blocks, containing statements that specify what to do if an exception is thrown in the <code>try</code> block. That is, you want the <code>try</code> block to succeed, and if it does not succeed, you want control to pass to the <code>catch</code> block. If any statement within the <code>try</code> block (or in a function called from within the <code>try</code> block) throws an exception, control immediately shifts to the <code>catch</code> block. If no exception is thrown in the <code>try</code> block, the <code>catch</code> block is skipped. The <code>finally</code> block executes after the <code>try</code> and <code>catch</code> blocks execute but before the statements following the <code>try...catch</code> statement.</p>
<p>The following example uses a <code>try...catch</code> statement. The example calls a function that retrieves a month name from an array based on the value passed to the function. If the value does not correspond to a month number (1-12), an exception is thrown with the value <code>"InvalidMonthNo"</code> and the statements in the <code>catch</code> block set the <code>monthName</code> variable to <code>unknown</code>.</p>
<pre class="brush: js">
function getMonthName (mo) {
    mo=mo-1; // Adjust month number for array index (1=Jan, 12=Dec)
    var months=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul",
          "Aug","Sep","Oct","Nov","Dec");
    if (months[mo] != null) {
       return months[mo]
    } else {
       throw "InvalidMonthNo"
    }
}

try {
// statements to try
    monthName=getMonthName(myMonth) // function could throw exception
}
catch (e) {
    monthName="unknown"
    logMyErrors(e) // pass exception object to error handler
}
</pre>
<h4 id="The_catch_Block" name="The_catch_Block">The catch Block</h4>
<p>You can use a <code>catch</code> block to handle all exceptions that may be generated in the <code>try</code> block.</p>
<pre class="brush: js">
catch (catchID) {
  statements
}
</pre>
<p>The <code>catch</code> block specifies an identifier (<code>catchID</code> in the preceding syntax) that holds the value specified by the <code>throw</code> statement; you can use this identifier to get information about the exception that was thrown. JavaScript creates this identifier when the <code>catch</code> block is entered; the identifier lasts only for the duration of the <code>catch</code> block; after the <code>catch</code> block finishes executing, the identifier is no longer available.</p>
<p>For example, the following code throws an exception. When the exception occurs, control transfers to the <code>catch</code> block.</p>
<pre class="brush: js">
try {
   throw "myException" // generates an exception
}
catch (e) {
// statements to handle any exceptions
   logMyErrors(e) // pass exception object to error handler
}
</pre>
<h4 id="The_finally_Block">The finally Block</h4>
<p>The <code>finally</code> block contains statements to execute after the <code>try</code> and <code>catch</code> blocks execute but before the statements following the <code>try...catch</code> statement. The <code>finally</code> block executes whether or not an exception is thrown. If an exception is thrown, the statements in the <code>finally</code> block execute even if no <code>catch</code> block handles the exception.</p>
<p>You can use the <code>finally</code> block to make your script fail gracefully when an exception occurs; for example, you may need to release a resource that your script has tied up. The following example opens a file and then executes statements that use the file (server-side JavaScript allows you to access files). If an exception is thrown while the file is open, the <code>finally</code> block closes the file before the script fails.</p>
<pre class="brush: js">
openMyFile();
try {
    writeMyFile(theData); //This may throw a error
}catch(e){
    handleError(e); // If we got a error we handle it
}finally {
    closeMyFile(); // always close the resource
}
</pre>
<p>If the <code>finally</code> block returns a value, this value becomes the return value of the entire <code>try-catch-finally</code> production, regardless of any <code>return</code> statements in the <code>try</code> and <code>catch</code> blocks:</p>
<pre class="brush: js">
function f() {
    try {
        alert(0);
        throw "bogus";
    } catch(e) {
        alert(1);
        return true; // this return statement is suspended until finally block has completed
        alert(2); // not reachable
    } finally {
        alert(3);
        return false; // overwrites the previous "return"
        alert(4); // not reachable
    }
    // "return false" is executed now
    
    alert(5); // not reachable
}
f(); // alerts 0, 1, 3; returns false
</pre>
<h4 id="Nesting_try...catch_Statements" name="Nesting_try...catch_Statements">Nesting try...catch Statements</h4>
<p>You can nest one or more <code>try...catch</code> statements. If an inner <code>try...catch</code> statement does not have a <code>catch</code> block, the enclosing <code>try...catch</code> statement's <code>catch</code> block is checked for a match.</p>
<h3 id="Utilizing_Error_objects">Utilizing Error objects</h3>
<p>Depending on the type of error, you may be able to use the 'name' and 'message' properties to get a more refined message. 'name' provides the general class of Error (e.g., 'DOMException' or 'Error'), while 'message' generally provides a more succinct message than one would get by converting the error object to a string.</p>
<p>If you are throwing your own exceptions, in order to take advantage of these properties (such as if your catch block doesn't discriminate between your own exceptions and system ones), you can use the Error constructor. For example:</p>
<pre class="brush: js">
function doSomethingErrorProne () {
   if (ourCodeMakesAMistake()) {
      throw (new Error('The message'));
   }
   else {
      doSomethingToGetAJavascriptError();
   }
}
....
try {
   doSomethingErrorProne();
}
catch (e) {
   alert(e.name);// alerts 'Error'
   alert(e.message); // alerts 'The message' or a JavaScript error message)
}</pre>
Zu dieser Version zurücksetzen