Javascript 1 Zentrale Frage Wie sieht das API / Objekt-Modell aus? Sprache / Runtime ● Etliche Klassen zur Unterstützung (Datum, String, Array usw.) Browser ● window ● document selfthtml.org xulplanet.com Tag Referenz Objekt Referenz für HTML und Firefox Browser Dokument ● DOM des W3C ● Kompletter Zugriff auf alle HTML Tags ● Inhalte: Via innerHTML ● Stil: Via style und className Via style auch die komplette CSS Welt ● Events: Via Event-Handler und W3C DOM Events 2 Javascript Typen: Schwach getypte Sprache ● typeof Operator prüft grundlegende Typen (primitiv / Objekt) ● instanceof Operator prüft auf Klasse eines Objekts Variablen nicht getypt Ausführungsmodell: Interpreter ● Keine statische Syntaxprüfung ● Erfordert White-Box Testen mit vollständiger Pfadabdeckung ● Daraus entstehen viele Nachteile für das Debugging ● Performance relativ gering ● Aber: eval (text); Methode verfügbar und sehr mächtig (und daher sicherheitstechnisch sehr problematisch) 3 Javascript Funktionen Funktionsdeklarationen ● Rekursion unterstützt ● Variablen und Retouren nicht getypt (mixed content möglich) function f(n) {if (n<=0) return (1); else return (n*f(n-1));} Funktionen sind "First Class Objects" ● Können in Variablen gespeichert werden ● Können als Parameter übergeben werden var fun = Math.sin; alert ("sin(pi/2)="+fun(Math.PI/2)); 4 Javascript Funktionen Funktionen erlauben anonyme Lambda-Definition var quad = function (x) {return x*x;} Closures: Anonyme Lambda-Definitionen mit freien Variablen var x = 7; var f = function (y) {return x*y;} x = 8; f(3) = ?? 5 Scripting Features Attribute von Objekten werden dynamisch generiert var test = new Object(); test.feld1 = "Wert"; test.feld2 = 34; test.feld1 = 99; // Umtypisierung zulässig Kurznotation var test = new Object(); test = {feld1:3, feld2:"Wert"}; 6 for / in Iterator Bietet Möglichkeit, alle Instanzvariablen zu iterieren ● In Java und C++ nicht ohne Weiteres möglich ● Vgl: Java Reflection API for (fieldName in object) {alert(fieldName);} Anwendung: Kompakte Werte-Tabellen zu einem Objekt document.writeln ("<table>") for (field in object) { document.writeln ("<tr><td>"+field+"</td>"); document.writeln ("<td>"+object[field]+"</td></tr>"); } document.writeln ("</table>"); 7 Grundlagen Anforderungen ● Dynamische Webseiten ohne Server-Interaktion ● Raschere Reaktion auf Client-Interaktion ● Ankoppelung an lokale Browser-Features ● Adaptive Webseiten Umsetzungen ● Javascript ● Java ● Visual Basic und weitere M$ Script-Sprachen Proprietär, nicht standardisiert, daher nicht empfohlen und hier auch nicht weiter behandelt 8 Zugriff auf Webseite <html><head>...</head> <body><h1>Beispiel</h1> <script type="text/javascript"> document.write("<hr>"); document.write("<b>Hello</b> World"); var x = document.getElementById("name"); x.innerHTML = "<b>Cap</b>"; </script> Guten Morgen Herr <span id="name"></span> </body></html> 9 Zugriff auf Header ... Diese Seite hatte als Referrer <script type="text/javascript"> function referrer() { if (document.referrer.length == 0) {return ("<i>nichts</i>");} else {return (document.referrer);} } document.writeln (referrer()); </script> 10 Schnittstelle Java - Javascript Applets mittels Javascript bedienen ● Applet muß Methoden zur Verfügung stellen ● document.applets[i].methodenName (paras) Javascript aus Java heraus aufrufen ● Klasse JSObject benötigt und im Applet importiert ● ● Stellt Methoden zum Zugriff auf JavaScript zur Verfügung Applet muß Attribut MAYSCRIPT im Tag tragen Beide Schnittstellen verfügbar Sicherheitseinschränkungen möglich 11 Server-Side Javascript Ermöglicht Interpretation und Verarbeitung von Seiten am Server Verfügt über einige weitere Objekte Beispiele: ● Screen Scraping ● Simulation eines Clients Implementierungen ● Rhinola ● Apache Cocoon 12