Transcript Java Script - Weierstrass Institute

Java Script
Vortrag: Anke Schulz
18.1.2000
DVG3 - JavaScript
1
Geschichte


JavaScript wurde von Netscape zunächst unter dem Code-Namen mocha,
dann unter dem Namen Live-Script entwickelt. Dabei hat man sich stark an
der Programmiersprache Java von Sun orientiert. Nachdem Netscapes
Entwicklung von Sun als "legitimer" Ableger von Java anerkannt wurde, hat
man als endgültigen Namen JavaScript gewählt.
JavaScript Version 1.0 wurde von Netscape erstmals 1995 in der BrowserVersion 2.00 auf den Markt gebracht. Die weiterentwickelte Version 1.1 ist mit
der Browser-Version 3.0 verfügbar. Mit Netscape 4.0, folgt JavaScript Version
1.2 .
DVG3 - JavaScript
2
Varianten



JScript ist die Microsoft-Variante von JavaScript - nicht identisch, aber doch
weitgehend kompatibel. Schwierig sind vor allem die neueren Befehle, die
noch nicht standardisiert sind.
ECMA ist eine europäische Standardisierungsorganisation, der u.a. Microsoft
und Netscape angehören. ECMA-Script ist der Versuch eines "StandardJavaScripts". Obwohl alle die Befolgung dieses Standards versprechen, ist das
Ziel noch nicht ganz erreicht. Eine Verwendung von ECMA-Script verspricht
aber schon eine weitreichende Kompatibilität.
VB-Script ist eine der vielen VisualBasic-Varianten von Microsoft. Da nur der
IE VB-Script versteht, ist es nicht so verbreitet. Hinzu kommt, daß es nicht so
sicher ist wie JavaScript, so daß die VB-Script-Verwendung bei den meisten
Surfern deaktiviert ist.
DVG3 - JavaScript
3
Was ist Java Script?






JavaScript ist kein direkter Bestandteil von HTML, sondern eine eigene
Programmiersprache. Diese Sprache wurde jedoch eigens zu dem Zweck
geschaffen, HTML-Autoren ein Werkzeug in die Hand zu geben, mit dessen
Hilfe sich WWW-Seiten optimieren lassen.
JavaScript wird in HTML-Dokumente eingebunden, sie stellt diverse
Funktionalitäten zur Verfügung.
Javascript-Programme werden erst durch den Internet-Browser ausgeführt.Die
Programmierung erfolgt als normaler Text im HTML-Code einer Seite.
Sie ist zwar nicht objektorientiert, aber dafür objektbasiert. So arbeitet man
mit der Methodik einer objektorientierten Sprache, kann aber keine eigenen
Objektklassen anlegen.
Da es sich bei JavaScript um eine Script-Sprache handelt, ist auch kein
Compiler zum Übersetzen des Programms erforderlich
JavaScript kann den Server und das Netz entlasten , indem Berechnungen auf
dem Client ausgeführt werden. Das ist meistens auch schneller.
DVG3 - JavaScript
4
Erweiterungen zu HTML





Überprüfung von Bedingungen (if ... else),
das Abarbeiten von Schleifen (for ..., while ...)
Reaktion auf Ereignisse, z.B. Mouse-Clicks oder
Bewegung der Maus über bestimmte Elemente, ohne dazu
mit dem Webserver in Kontakt treten zu müssen
Durchführung von Berechnungen
Überprüfung von Formularen vor dem Abschicken,
Änderung des Inhalts mehrerer Frames mit einem Link,
dynamisches Ändern von Farben, dynamisches
Austauschen von eingebundenen Bildern
DVG3 - JavaScript
5
Was kann JavaScript?






JavaScript kann auf Eingaben reagieren und entsprechende Ausgaben
machen .
Eingaben können z.B. Tastatureingaben oder Mausbewegungen und -klicks
des Benutzers sein, aber sich auch aus der Umgebung des Benutzers herleiten,
wie Betriebssystem, verwendeter Browser.
JavaScript kann mit dem Browser interagieren : Fenster öffnen und
schließen, die Statusleiste beschreiben, in der History umherwandern, ...
JavaScript kann HTML schreiben oder auf anderen Wegen Ziele erreichen,
die man mit HTML auch erreichen könnte. Beispielsweise Links setzen und
Schrift formatieren.
JavaScipt kann auch noch Cookies auf der Platte des Users speichern - in
beschränkter Anzahl und Größe, nur lesbar vom Server aus, der sie geschrieben
hat, nur mit Name/Wert-Paaren.
Ausgaben sind meist Bildschirmdarstellungen, können aber auch Sound sein
oder der Druck der Seite, oder Mailversand, ...
Eine HTML-Seite, die JavaScript enthält, darf maximal 32K groß sein.
DVG3 - JavaScript
6
Was kann Java Script nicht?






JavaScript kann nicht Dateien schreiben, weder auf die Platte des Users noch
auf den Server(außer Cookies ), auch keine Registry-Einträge o.ä.
JavaScript kann nicht die Daten von Browserfenstern fremder Server lesen
.
JavaScript kann nicht "fremde" Fenster schließen , unsichtbare Fenster
anlegen, rahmenlose Fenster anlegen.
JavaScript kann nicht heimlich e-Mails verschicken .
JavaScript kann nicht den Quellcode einer Datei verbergen , auch nicht
seinen eigenen. Der Browser muß ihn lesen können, also kann das der User
auch.
JavaScript hat keine Grafik-Fähigkeiten . Es kann keine Striche oder Kreise
malen. Fertige Grafikdateien allerdings kann es (wie HTML) anzeigen, mit
den Filtern im IE sogar bearbeiten
DVG3 - JavaScript
7
Java und JavaScript- Unterschiede






Ein Browser arbeitet eine HTML-Seite von oben nach unten durch. Das
bedeutet, daß Javascript-Befehle sich erst auf Objekte beziehen dürfen, wenn
diese schon erzeugt wurden.
JavaScript wird zur Laufzeit interpretiert, Java wird bei der Entwicklung
compiliert.
In JavaScript werden Objekt-Referenzen erst zur Laufzeit geprüft, in Java
bereits während der Compilierung.
JavaScript ist objekt-basierend und kennt keine Vererbung, Java ist objektorientiert, Objekte vererben ihre Eigenschaften.
JavaScript-Code ist in das HTML-Dokument integriert und kann auf die
(meisten) HTML-Elemente zugreifen. Java-Applets sind getrennt von der
HTML-Seite.
In JavaScript müssen die Typen der verwendeten Variablen nicht deklariert
werden, in Java ist das erforderlich.
In JavaScript werden Objekt-Referenzen erst zur Laufzeit geprüft, in Java
bereits während der Compilierung.
DVG3 - JavaScript
8
Sicherheit

Von Anfang an galt: JavaScript kann nicht auf die Festplatte des Anwenders
schreiben. In der im Netscape 2.00 enthaltenen Version war es allerdings noch
möglich, mit JavaScript die Verzeichnisse auf der Festplatte zu lesen.
Außerdem war es möglich, die History-Liste (also die Liste der bisher vom
Benutzer besuchten URL's) des Browsers auszulesen. Und schließlich war es
in dieser ersten Version möglich, ohne Zutun des Benutzers Mail's - unter dem
Namen des benutzers - an beliebige Adressen zu verschicken.
Mit Netscape 2.01 wurden diese drei Möglichkeiten beseitigt.
DVG3 - JavaScript
9
Java Script in HTML einfügen

Java Script wird in den HTML text eingefügt:

<html>
<head><title>Test</title>
<script language="JavaScript">
<!-....
// JavaScript Programmtext





Der Beginn des Scripts wird durch das HTML-tag <script> gekennzeichnet.
Die folgende Zeile, die HTML-Kennung für den Beginn eines Kommentars,
dient dazu, das eigentliche Script vor Browsern zu "verstecken", die kein
JavaScript beherrschen.
DVG3 - JavaScript
10
... und wieder beenden








....
//-->
</script>
</head>
<body></body>
</html>
. Am Ende wird das "Verstecken" des JavaScripts mit der HTML-Kennung -->
abgeschlossen. Da wir uns aber noch innerhalb des Scripts befinden, muß
diese HTML-Kennung wiederum vor dem JavaScript-Interpreter versteckt
werden. Dazu dient das //, daß innerhalb von JavaScript einen Kommentar
kennzeichnet. Schließlich wird mit </script> das Script abgeschlossen.
Die ganze Folge von Anweisungen wird nach Interpretation des Scripts vom
Browser so gesehen, als ob reiner HTML-Code verwendet würde.
DVG3 - JavaScript
11
Hello World

Java Script

HTML

<center>
<script language="JavaScript">
<!-document.write("<font size=+2>");
document.write("Hello World!");
document.write("</font>");
//-->
</script>
</center>

<center>

<font size=+2>
Hello World!
</font>










</center>
Bsp 1
DVG3 - JavaScript
12
Operatoren I

Arithmetische (also auf Zahlen anzuwendende) Operatoren sind
+ Addition,
z.B. 4 + 3 = 7
- Subtraktion,
z.B. 4 - 3 = 1
* Multiplikation,
z.B. 4 * 3 = 12
/ Division,z.B. 12 / 3 = 4
% Der Modulo Operator liefert den ganzzahligen Divisionsrest,
z.B. "11 % 3 = 2", denn 11 geteilt durch 3 ergibt 3 Rest 2
Kurzformen wie in Java
x++
x--

z = (x < y) ? x : y

Einzeilige Bemerkungen werden durch // eingeleitet und werden dann vom
Browser nicht beachtet!
Mehrzeilige Bemerkungen beginnen mit /* und enden mit */








DVG3 - JavaScript
13
Operatoren II

Bit-weise logische Operatoren werden auf (die 32-bit Darstellung von) Zahlen
oder logischen Werten angewandt:
&
logisches UND,
z.B. "true & false = false" oder "9 & 3 = 1", denn die
Binärdarstellung
1001 von 9 bitweise UND-verknüpft mit der Binärdarstellung 0011 von 3
ergibt 0001.
|
logisches ODER,
z.B. "true | false = true" oder "9 | 3 = 11" (binär 1001 | 0011 = 1011)
^
logisches XOR (exklusives Oder: entweder oder, aber nicht beides),
z.B. "true ^ false = true" aber "true ^ true = false" oder "9 ^ 3 = 10" (binär
1001 ^ 0011 = 1010).
>> rechts Shift,
z.B. "9 >> 2 = 2" (binär 0010).

<<





links Shift,
z.B. "9 << 2 = 36" (binär 100100).
DVG3 - JavaScript
14
Rechnungen

3 Schafe haben 12 Beine

<script language="JavaScript">
<!-var anzahl;
var name="Schafe";
anzahl=3;
var beine=4*anzahl;
var satz=anzahl+" "+name+" haben "+beine+" Beine";
document.write(satz);
//-->
</script>
Bsp 1
Wie in Java gibt es auch hier die verschiedenen Zuweisungs möglichkeiten











DVG3 - JavaScript
15
Variable



Mit dem Schlüsselwort var werden Variablen deklariert. Im Gegensatz zu Java
muß bei der Deklaration kein Typ angegeben werden; es wird also nicht
festgelegt, ob es sich bei der Variablen um einen Zahlentyp, einen Character
oder einen String handelt. Die Typfestlegung wird automatisch von JavaScript
bei jeder Wertzuweisung vorgenommen. Eine Variable kann innerhalb eines
Scripts seinen Typ (mehrfach) ändern.
JavaScript unterscheidet zwischen Groß- und Kleinschreibung.
Mit einer Deklaration kann, muß aber nicht, eine Wertzuweisung verbunden
sein. (Wie bei Java)
Das Schlüsselwort var zur Variablen-Deklaration ist nicht grundsätzlich
erforderlich; beim ersten Auftreten eines bisher nicht verwendeten
Variablennamens legt JavaScript die entsprechende Variable auch von
allein an. Die Verwendung oder Nicht-Verwendung von var entscheidet
jedoch über den Gültigkeitsbereich der Variablen
DVG3 - JavaScript
16
Gültigkeit von Variablen



Es wird zwischen globalen und lokalen Variablen unterschieden.
Lokale Variablen gelten nur innerhalb einer Funktion.
Globale Variablen gelten überall innerhalb des aktuellen Dokuments.



Lokale Variablen entstehen, wenn die Variablen mit dem
Schlüsselwort var innerhalb einer Funktion definiert werden.
Wenn die Variablen durch direkte Wertzuweisung innerhalb einer
Funktion definiert werden, entstehen globale Variablen.
Eine Variable, die außerhalb einer Funktion deklariert wird, ist
grundsätzlich eine globale Variable, egal ob var verwendet wurde oder
nicht.
DVG3 - JavaScript
17
Einfache Dialogbox

Es erscheint eine einfache Dialogbox mit einem Button.

function dialog ()
{
alert ("das ist meine Hompage");
} <BODY onload="dialog ()">...</BODY>



Bsp 2

DVG3 - JavaScript
18
Dialogbox mit zwei Schaltflächen












function dialog ()
{
var Eingabe;
Eingabe= confirm (“Du kommst zu meiner Hompage");
if (Eingabe==true)
{
window.open ("JS Bsp 3.html");
}
else
{
window.document.write ("<H3> Schade, daß Du meine
Seite nicht sehen willst!</H3>");
}
} <BODY onload="dialog ()">...</BODY>
Bsp 4
DVG3 - JavaScript
19
Dialogbox mit Eingabefeld









function dialog ()
{
var Eingabe;
Eingabe=prompt (“....?");
if (Eingabe==“xy")
{
}
else
{
}
}
Bsp 5

DVG3 - JavaScript
20
Browser abfragen

Durch den Befehl navigator.appName
wird der Browser ermittelt
Bsp 9

 Dynamische


grafische Links
Die Links können sich verändern, wenn die Maus auf das Bild kommt,
wieder weg geht oder wenn es angeklickt wird.
Bsp 6
DVG3 - JavaScript
21