Java wird in unterschiedlichem Kontext verwendet:
Da Java Kode nicht wie JavaScript Kode interpretiert wird, muss der Java Kode übersetzt werden.
Der übersetzte Kode wird dann von einem Java Byte Kode Interpreter ausgeführt.
Um Java Kode übersetzen und ausführen zu können wird hier das "Java Developer´s Kit" (JDK) von Sun verwendet.
Die folgenden Schaubilder verdeutlichen die Vorgehensweise der Erstellung von Java (Konsol-) Anwendungen:
Das folgende Beispiel zeigt eine Java Konsolanwendung (Datei HelloWorldApp.java):
/**
* The HelloWorldApp class implements an application that
* simply displays "Hello World!" to the standard output.
*/
class HelloWorldApp {
public static void main(String[] args) {
System.out.println("Hello World!");
//Display the string.
}
}
Die Übersetzung des Programms durch den Java Compiler erfolgt durch:
$ javac HelloWorldApp.java
$ ls -l *.class
-rw-r--r-- 1 as Kein 432 Dec 27 10:20 HelloWorldApp.class
$
Nun kann die Anwendung aufgerufen werden:
$ java HelloWorldApp
Hello World!
$
Von JavaScript innerhalb einer HTML Seite kann man nicht auf Java Konsolprogramme zugreifen.
Wir wollen keine Konsolanwendung realisieren. Wir wollen von JavaScript auf ein Java Applet zugreifen.
Als Beispiel wird zunächst ein Applet realisiert, mit dem "Hello World!" in einem Java-fähigen Browser erscheint.
Um ein Java Applet zu erzeugen, kann unter Windows wie folgt vorgegangen werden:
1. Erzeugung des Applets in der Datei "HelloWorld.java"
import java.applet.*;
import java.awt.*;
/**
* The HelloWorld class implements an applet that
* simply displays "Hello World!".
*/
public class HelloWorld extends Applet {
public void paint(Graphics g) {
// Display "Hello World!"
g.drawString("Hello world!", 50, 25);
}
}2 . Übersetzen der Java Quelldatei in den Java Bytekode
3. Erzeugen einer HTML Seite
<HTML>
<HEAD>
<TITLE>A Simple Program</TITLE>
</HEAD>
<BODY>
Here is the output of my program:
<APPLET CODE="HelloWorld.class" WIDTH=150 HEIGHT=50>
</APPLET>
</BODY>
</HTML>
4. Start des Programms
Das Applet kann in einem Browser betrachtet werden, oder man verwendet einen Appletviewer, der zum JDK gehört.
Java ist bzgl. der zur Verfügung stehenden Methoden der Standardklassen mächtiger (z.B. Grafik, Netzkommunikation, GUI). Auf der anderen Seite kann man mit Java nicht direkt auf Elemente einer HTML Seite zugreifen.
Die Kombination beider Sprachen bildet den "Best of both World" Ansatz, der in vielen Anwendungsfällen zu wählen ist.
Von JavaScript kann man auf alle Elemente und Methoden eines Java Applets zugreifen, die public sind.
Im Folgenden werden zwei Beispiele gezeigt:
Hier wird ein Java Applet verwendet, um Linien zu Zeichnen. Die Eingabe der Koordinaten erfolgt in einem HTML Formular. Diese Werte werden über JavaScript an das Applet übergeben.
Ansehen des Beispiels: linien.htm
Zunächst das Beispiel Applet:
import java.awt.*;
import java.applet.Applet;
public class lines extends java.applet.Applet {
int x1, y1, x2, y2;
boolean draw=false;
public void paint(Graphics g) {
if (draw) {
g.drawLine(x1,y1,x2,y2);
draw = false;
}
}
// update redefiniert, damit Linien NICHT geloescht werden
public void update(Graphics g) {
paint(g);
}
public void drawLine(int x1, int y1,
int x2, int y2) {
this.x1 = x1;
this.x2 = x2;
this.y1 = y1;
this.y2 = y2;
draw = true;
// neue Linie zeichnen
repaint();
}
}
Mit JavaScript kann man die Applets auf einer HTML Seite über das Array "document.applets" ansprechen oder über einen Applet Tag definierten Namen.
<applet code="linien.class"
name="linien"
width="360"
height="200" >
</applet>
Damit kann man auf das Applet mit "document.linien" oder "document.applets[0]" auf das Applet zugreifen.
Der Zugriff auf Methoden des Applet erfolgt genau so wie der Zugriff auf JavaScript Methoden:
"document.linien.drawLine(x1,y1,x2,y2)"
In unserem Beispiel wird eine globale Variable "myApplet" definiert, um weniger Schreiben zu müssen (document.linien).
Der Zugriff wird über einen kleinen Trick sicher gemacht, denn es muss verhindert werden, dass auf eine Methode des Applet zugegriffen wird (von JavaScript aus) bevor das Applet vollständig geladen ist:
Die wird erreicht, in dem die Variable myApplet auf null geprüft wird; myApplet wird initialisiert, nachdem auf das Ereignis "load" mittels Eventhandler reagiert wurde.
Somit können wir auf die Methoden des Applets wie folgt von einer JavaScript Funktion zugreifen:
<script language="JavaScript">
var myApplet; /* global definiert */
function init() {
myApplet = document.linien;
}
function newLine(formular) {
var x1 = parseInt(formular.x1.value);
var x2 = parseInt(formular.x2.value);
var y1 = parseInt(formular.y1.value);
var y2 = parseInt(formular.y2.value);
/* call method of applet */
if ( myApplet != null)
myApplet.drawLine(x1,y1,x2,y2);
}
</script>
Im HTML Dokument wird ein Formular verwendet, um Werte vom Benutzer abzufragen. Ein Eventhandler ruft dann die o.a. JavaScript Funktion auf.
<body onLoad="init()">
<applet code="lines.class"
name="linien"
width="360"
height="200"
>
</applet>
<form name="eingabe">
x1:<input type="text" name="x1" value="10" size="5">
y1:<input type="text" name="y1" value="10" size="5">
x2:<input type="text" name="x2" value="100" size="5">
y2:<input type="text" name="y2" value="100" size="5">
<input type="button" value="draw"
onClick="newLine(this.form)" >
</form>
</body>
Die vollständige HTML Seite hat somit folgendes Aussehen:
<html>
<head>
<title>Applets</title>
<script language="JavaScript">
var myApplet; /* global definiert */
function init() {
myApplet = document.linien;
}
function newLine(formular) {
var x1 = parseInt(formular.x1.value);
var x2 = parseInt(formular.x2.value);
var y1 = parseInt(formular.y1.value);
var y2 = parseInt(formular.y2.value);
/* call method of applet */
if ( myApplet != null)
myApplet.drawLine(x1,y1,x2,y2);
}
</script>
</head>
<body onLoad="init()">
<applet code="lines.class"
name="linien"
width="360"
height="200"
>
</applet>
<form name="eingabe">
x1:<input type="text" name="x1" value="10" size="5">
y1:<input type="text" name="y1" value="10" size="5">
x2:<input type="text" name="x2" value="100" size="5">
y2:<input type="text" name="y2" value="100" size="5">
<input type="button" value="draw"
onClick="newLine(this.form)"
>
</form>
</body>
</html>
Bei der Übergabe von Werten von JavaScript und umgekehrt ist zu beachten, dass beide Sprachen unterschiedliche Datentypen kennen. Die folgenden Tabellen zeigen, wie die Umwandlung durchgeführt wird:
| von JavaScript | nach Java |
| String | String |
| Number | Float |
| Boolean | Boolean |
| von Java | nach JavaScript |
| Boolean | Boolean |
| byte | Number |
| char | Number |
| short | Number |
| int | Number |
| long | Number |
| float | Number |
| double | Number |
| String | String |
| Arrays | werden in JavaScript Objekt verpackt; length bleibt erhalten, Adressierung über Index möglich. |
Vorsicht:
Bei der Umwandlung kann es zu Verlusten kommen, z.B. wenn Java-Long (64 Bit) -> JavaScript (32 Bit).
Diese Umwandlung wird im folgenden Beispiel verwendet, um Java rechnen zu lassen und das Ergebnis von JavaScript in ein HTML Formular zu schreiben.
<html>
<head>
<title>Applets</title>
<script language="JavaScript">
var myApplet; /* global definiert */
function init() {
myApplet = document.funct;
}
function add(x,y) {
var n1 = new Number;
var n2 = new Number;
n1 = x;
n2 = y;
/* call method of applet */
if ( myApplet != null) {
return
myApplet.add(n1,n2)
} else
return
undefined;
}
</script>
</head>
<body onLoad="init()">
<applet code="funct.class"
name="funct"
width="0"
height="0" >
</applet>
<form name="eingabe">
x:<input type="text" name="x" value="10"
size="5">
y:<input type="text" name="y" value="15"
size="5">
res:<input type="text" name="r" size="5">
<input type="button" value="add"
onClick="r.value=add(x.value, y.value)" >
</form>
</body>
</html>
Der Java Kode des Applets:
import java.awt.*;
import java.applet.Applet;
public class funct extends java.applet.Applet {
public float add(float x, float y) {
return x + y;
}
public float sub(float x, float y) {
return x - y;
}
public float mul(float x, float y) {
return x * y;
}
public float div(float x, float y) {
return x / y;
}
}
Die Interaktivität war bisher meist vom Benutzer getrieben. Effekte lassen sich erzielen, indem per Programm auf Ereignisse reagiert wird, die zeitgesteuert anlaufen. Wenn eine Uhr sekundengenau die Zeit anzeigen soll, so kann die HTML Seite andere Benutzeraktivitäten abarbeiten.
Deshalb wird ein Mechanismus gebraucht, durch den Programme "im Hintergrund" ablaufen können. Dazu gibt es so genannte Timer. Durch die Angabe einer Funktion, die nach einer gewissen Zeit ausgeführt werden soll, kann eine Programm in der bis zu dieser Zeit verbleibenden Zeit, andere Aktionen ausführen.
Die Methode des window-Objektes, die dies ermöglicht ist setTimeout(); der erste Parameter gibt die Funktion an, die nach der Zeit, die der zweite Parameter (in Millisekunden) ausdrückt, aufgerufen wird.
Timer werden im Web oft verwendet, um nach kurzer Zeit auf eine neue Home Page zu verzweigen,
Eine Uhr auf einer Web Seite ist mit Timer einfach zu programmieren:
Timer können auch gelöscht werden. Dazu existiert die Methode "clearTimeout()". Als Parameter muss der Name des Timers angeben werden.
Laufschriften (scroller) sind von Nachrichtentickern bekannt. Aus Web-Seiten sind sie mit JavaScript umsetzbar.
Das ersten Beispiel zeigt, wie der Text der Statuszeile in regelmäßigen Abständen geändert werden kann. Verwendet werden Arrays und Timer.
Laufschriften sind durch das folgende Programm realisierbar. Angezeigt wird immer ein Text, der mit einer abnehmenden Anzahl von Blanks links aufgefüllt wird. So entsteht der Effekt der Laufschrift.