Einführung in JavaScript II Musikwissenschaftliches Institut Hamburg WS 2005/06 Klaus Frieler

JavaScript II Verzweigungen (if-else) Wichtiges Element einer jeden Programmiersprache ist die bedingte Ausführung von Anweisungen, d.h. Verweigungen. Syntax: if (<bedingung>) <anweisungen1> [else <anweisungen2>] <bedingung> ist ein beliebiger logischer Ausdruck (in runden Klammern) und <anweisungen1/2> eine Anweisung oder ein Anweisungsblock in geschweiften Klammern. Anweisungen können auch wieder Verzweigungen sein. Der else -Zweig ist optional. Semantik: Ist die Bedingung wahr wird <anweisungen1> ausgeführt, falls nicht wird entweder nichts getan oder der <anweisungen2> ausgeführt (mit else-Zweig)

JavaScript II Verzweigungen (if-else) Beispiele: if (moin<0) alert("Zu klein"); if(moin<1) moin = 0; else moin--; if(moin<0) moin = 0; else if(moin>=5) moin = 5; else{ moin = moin++; alert(moin); }

JavaScript II Verzweigungen (?-Operator) Programmierer sind faul, deswegen gibt es für eine einfache Entweder-Oder-Abfrage eine spezielle Kurzschreibweise, den ?-Operator Syntax: <variable> = (<bedingung>) ? <wert1> :<wert2> Semantik: Dies ist gleichbedeutend mit: if (<bedingung>) <variable> = <wert1>; else <variable> = <wert2>;

JavaScript II Verzweigungen (?-Operator) Beispiele: moin = (moin<0) ? 0 : moin; alert( (moin<0) ? "Zu klein" : "Genau richtig"); alert((moin<0) ? "Zu klein" : (moin>5) ? "Zu groß" :"Genau richtig");

JavaScript II Verzweigungen (switch-case) Um mehrer Fälle unterscheiden zu können gibt es die switch-case Anweisung. Syntax: switch(<variable>){ case <wert1>: <anweisung> [break;] [case <wert2>: <anweisung> [break;] ] [case …] [default: <anweisung> [break;]] }

JavaScript II Verzweigungen (switch-case) Semantik: Der Wert der Variable <variable> wird mit den Werten hinter den case-Schlüsselworten verglichen, sind sie identisch wird der Anweisungsblock dahinter ausgeführt. (Fehlt das Schlüsselwort break; werden auch alle Anweisungen alle folgenden Fälle ausgeführt (Fall-through) bis zum nächsten break!) Trifft keiner der Fälle zu, werden die Anweisungen hinter dem optionalen default-Fall ausgeführt.

JavaScript II Verzweigungen (switch-case) Beispiele: switch(moin){ case 1: alert("1"); break; case 2: alert("2"); default: alert("Alles andere."); }

JavaScript II Schleifen Ein weiteres grundlegendes Element jeder Programmiersprache sind Schleifen,d.h. Anweisungen werden solange wiederholt bis eine bestimmte Bedingung eintritt. Es gibt drei Typen von Schleifen in JavaScript: while, do-while und die for-Schleife

JavaScript II Schleifen – while-Schleife Syntax: while(<bedingung>) <anweisungen> <bedingung> kann eine beliebiger logischer Ausdruck sein, <anweisungen> eine einzelne Anweisung oder eine Anweisungsbock in geschweiften Klammern.

JavaScript II Schleifen – while-Schleife Beispiele: while(true) i = i+1; (Achtung:Endlosschleife!) while(false) i = i+1; (Achtung:Keine Schleife!) i = 0; while(i<10){ i = i+1; alert(i); }

JavaScript II Schleifen – do-while-Schleife Syntax: do <anweisungen> while(<bedingung>) <bedingung> kann eine beliebiger logischer Ausdruck sein, <anweisungen> eine einzelne Anweisung oder eine Anweisungsbock in geschweiften Klammern. Unterschied zur while-Schleife: Die Anweisungen werden mindestens einmal ausgeführt, weil die Bedingung erst am Ende geprüft wird.

JavaScript II Schleifen – for-Schleife Syntax: for([<anweisung1>];[<bedingung>];[<anweisung2>]) <anweisungen> <anweisung1> ist einfache Anweisung (kein Block!), zumeist Initialisierung einer Laufvariablen; <bedingung> ist die Abbruchbedingung <anweisung2> ist einfache Anweisung, zumeist Variation (z.B. Hochzählen) der Laufvariablen Alle drei Angaben sind optional!

JavaScript II Schleifen – for-Schleife Beispiele: for(j = 0; j<3; j++) alert(j); for(i = 10; i>=0; i -= 2){ zahl += i; alert(zahl * zahl); } for(;;) alert("Endlosschleife");

JavaScript II Schleifen – break und continue Mit den Schlüsselwörter break und continue kann man alle Schleifen beeinflussen. Durch break wird die Schleife sofort beendet. Durch continue wird an den Anfang des Schleifenblocks gesprungen. Bei der for-Schleife wird dabei noch <anweisung2> ausgeführt und <bedingung> geprüft.

JavaScript II Schleifen – break und continue Beispiel: while(true){ if(i==10) break; i = i + 1; } for(i = 0; i<10; i++){ if(i % 2) continue; alert(i);

JavaScript I Funktionen Funktionen sind Unterprogramme, d.h. wieder verwendbare Programmteile Sie können mit Parametern aufgerufen werden und können einen Wert zurückgeben Jede komplexere Anweisungsfolge, die in einem Script mehrmals benutzt werden, sollten in Funktionen gekapselt werden. Sammlungen von Funktionen nennt man auch (Funktions-)Bibliotheken. (Z.B. dll‘s bei Windows)

JavaScript I Funktionen Syntax: function <name>([Parameterliste]) { <anweisungen> [return <value>;] } <name> ist ein Bezeichner der den selben Regeln wie Variablennamen unterworfen ist Die Parameterliste ist optional, sie besteht aus einer durch Komma getrennte Liste von Variablennamen, den Argumenten der Funktion. Die geschweiften Klammern sind zwingend. Im Funktionsrumpf können beliebige Anweisungen stehen. Die return-Anweisung ist optional. Der dort angegebene Wert ist der Rückgabewert.

JavaScript I Funktionen Beispiele: function leer() { } function ausgabe(text) alert(text); function mult(x,y) var z = x*y; return z;

JavaScript I Funktionen Funktionen dürfen sich auch selbst aufrufen, dass nennt man Rekursion. Sehr elegant, aber nicht immer effizient und potentiell gefährlich (Endlosschleife). Beispiel: function fakultaet(n) { if(n <= 1) return 1; return n*fakultaet(n-1); }

JavaScript I Objekte Objekte sind Konstrukte die Variablen und Funktionen unter einem gemeinsamem Dach vereinen. In JavaScript kann man eigene Objekte definieren, aber meisten benutzt man nur die vordefinierten Objekte (z.B. window, document), vor allem um auf den Browser und die HTML-Seite zuzugreifen. Variablen eines Objektes heißen „Membervariablen“ und Funktionen heißen auch „(Objekt)Methoden“

JavaScript I Objekte Auf die Variabeln und Funktionen eines Objektes greift man durch die Punktschreibweise zu. Bespiel: myObject.myVariable = 5; test = myObject.myFunction(myObject.myVariable); Objekte können auch wieder Unterobjekte haben. Auch auf sie greift man durch die Punktschreibweise zu: myObject.mySubobject.myVar = 5; test = myObject.mySubobject.myFunction(myObject.myVariable);

JavaScript I Objekte Z.B. ist jeder String in JavaScript eigentlich ein Objekt! Beispiel: var text ="Teststring"; if(text.charAt(0) == "T") alert("Beginnt mit T!") else alert("Beginnt nicht mit T!"); for(i = 0; i<text.length; +i){ alert(text.charAt(i)); }

JavaScript I Arrays Arrays sind ebenfalls grundlegende Elemente vieler Programmiersprachen Ein Array ist eine Zusammenfassung vieler gleichartiger Variablen unter einem gemeinsamen Namen. Die einzelnen Elemente kann man durch einen Index ansprechen, z.B. vektor[0] Der Index ist 0-basiert, d.h. das erste Element wird durch den Index 0 angesprochen. In JavaScript sind Arrays durch das eingebaute Array-Objekt realisiert.

JavaScript I Arrays Beispiel: //erzeugen eines leeren Arrays var empty= new Array(); //erzeugen eines Arrays mit 5 Zahlen var vektor= new Array(1, 2, 3, 4, 5); /*Die Membervariable "length" enthaelt die Laenge des Arrays*/ for(i = 0; i< vektor.length; ++i){ vektor[i] = vektor[i]* vektor[i]; }

JavaScript I Arrays Beispiel: Umwandeln eines Strings in ein Zeichenarray: var text ="Teststring"; var charArray= new Array(); for(i = 0; i<text.length(); ++i){ charArray[i] = text.charAt(i); }