Historisch gesehen, hat sich u.a. wegen der beschränkteren technischen Möglichkeiten zunächst diese Form des Programmierens (z.B. mit PASCAL) entwickelt. Der algorithmische Kern ist dabei häufig leichter zu erkennen, wenn er nicht von einer Fülle von Steuermöglichkeiten (Ereignissteuerung, insbesondere Nutzung der Maus in Verbindung mit der grafischen Benutzeroberfläche) umhüllt ist.
Er kann Befehle (Kommandos, Anweisungen) ausführen, die weit über bloßes Rechnen (compute) hinausgehen. Das Herz bzw. Hirn des Computers ist der Mikroprozessor (CPU = Central Processing Unit). Er besitzt sehr viele elektrische Anschlüsse (siehe Foto). Auf jeder angeschlossenen Leitung liegt eine Spannung von 0 Volt (kurz 0) oder 5 Volt (kurz 1) an. Ein Bit (Binary digit) ist die kleinste Informationseinheit (Alternative 0 oder 1). Die Informationen, die in dieser Form auf den Leitungen liegen, können sich in der Taktfrequenz des Mikroprozessors (z.B. 2,8 Gigaherz = 2800 000 000 mal pro Sekunde) ändern. Acht Bit werden zu einem Byte zusammengefasst. Achtstellige Binärzahlen können z.B. die Zahlen von 0 bis 255 darstellen. Auch jeder Befehl an den Mikroprozessor bekommt eine Nummer. Diese Befehle bilden den eingebauten Befehlssatz des Mikroprozessors.
Der Mikroprozessor kann durch die korrekte Anwendung der Befehle dieses Befehlssatzes (Maschinensprache) programmiert werden. Alle Befehl müssen ihm letztlich in dieser Form mitgeteilt werden. Das ist aber für den Programmierer sehr mühsam. Man hat deswegen höhere Programmiersprachen geschaffen, wo die Befehle einfacher formuliert werden können, weil sie sich auf wesentliche Aufgaben konzentrieren. Die Befehle sind zudem in der Regel mit Hilfe der englischen Sprache gebildet und somit intuitiv verständlich.
Die Befehle müssen nun aber in die Maschinensprache übersetzt (interpretiert) werden.
Bei Javascript leistet dies z.B. der Browser (Internet Explorer, Firefox usw.). Auch bei MSW-Logo musste man das Programm, das man zum Entwickeln des Programms benötigte, benutzen um das fertige Programm auszuführen.
Bei einem solchen Interpreter wird jeder Befehl übersetzt und auch sofort ausgeführt. Bei Visual-Basic gibt es dazu die Runtime-Module (VBRun##.dll).
Für manche Programmiersprachen (z.B. Pascal) gibt es Compiler, die den ganzen Quelltext (source-code) erst komplett übersetzen und dabei auch noch eine Optimierung vornehmen.
Solche Programme sind in der Ausführung schneller. Das Ergebnis ist eine ".exe"-Datei (=execute), die direkt (also ohne zusätzliches Programm) auf Betriebssystemebene ausgeführt werden kann.
Damit ein Javascriptprogramm im Browser gestartet werden kann, muss es in eine HTML-Datei eingebunden sein. Javacript gehört jedoch nicht selbst zu HTML, sondern dient als Hilfsmittel und Ergänzung zu HTML.
Eine der häufigsten Anwendungen besteht in der Bearbeitung bzw. Überprüfung von Formulareingaben (z.B. Online-Bestellungen, Abfragen bei Suchmaschinen oder anderen Datenbanken) bevor diese an den Server weitergeleitet werden.
JavaScript wurde zu diesem Zweck 1995 von Netscape eingeführt und sollte auch nicht mit dem viel mächtigeren Java, das wesentlich mehr leisten kann, verwechselt werden.
Allerdings sind viele Befehle gleich oder sehr ähnlich aufgebaut.
JavaScripts werden auf dem eigenen Rechner im Browser ausgeführt. Die gängigen Browser (insbesondere Netscape und Internet-Explorer) sind so eingerichtet, dass sie die Scripts zur Laufzeit interpretieren können.
Diese Fähigkeit des Browsers lässt sich - aus Sicherheitsgründen - auch abschalten. Andere Scriptsprachen wie z.B. PHP oder CGI laufen auf dem Server und können dementsprechend nicht vom Benutzer manipuliert werden, weshalb sie häufig bevorzugt werden.
Für das Schreiben von Javascript-Programmen benötigt man lediglich einen einfachen Texteditor wie Notepad, EditPad-Lite oder Html-Edit.
Sehr Aufschlussreiches zu Javascript findet man bei Selfhtml .
Als Entwicklungswerkzeug empfehle ich den HTML-Editor Phase5 (v5.5): Download-Seite (www.qhaut.de) Klicke unten auf "Download Now"!
Normalerweise benötigt man für ein Projekt mehrere Sitzungen. Es ist sinnvoll, wenn man lernt, ein Projekt gleich am Anfang sinnvoll anzulegen. Unter dem Menüpunkt "Projekt -> Neues Projekt" wählen wir eine passendere Bezeichnung an Stelle von Neues Projekt1.
Die Optionen können so bleiben. Bei den Verzeichnissen wählen wir - nachdem wir zuvor einen geeignet benannten Ordner z.B. "javascript" (in der Schule natürlich auf dem Laufwerk Z im Ordner "winhome") eingerichtet haben, diesen Ordner als Stammordner.
Unter Neue Dokumente kann man z.B. unter Autor noch seinen Namen eintragen. Dann auf übernehmen klicken.
Wenn im HTML-Editor links oben das richtige Projekt eingestellt ist, gehen wir auf Datei -> Neues Dokument
Nun klicken wir ohne weitere Eintragungen auf Übernehmen. Wir markieren dann den gesamten Text und löschen ihn.
Jetzt markieren wir den untenstehenden Quelltext (im Textfeld) um ihn zu "Kopieren" und um ihn danach in HTML-Edit mit
"Einfügen" zu übertragen.
Im Bereich der Leerzeile 05 zwischen 04 <script ...> und 06 </script> wird nun das eigentliche Javascript-Programm eingetragen.
04
<script type="text/javascript">
leitet in HTML den Javascript-Bereich ein. Dieser Bereich wird mit 06 </script> abgeschlossen. Bemerkung: In Zeile 04 darf man auch schreiben <script language="Javascript"> |
EVA = Eingabe - Verarbeitung - Ausgabe ist eine besonders einfache Programmstruktur.
Beispiel EVA: Eingabe einer Zahl, Verarbeitung = Quadrieren der Zahl und schließlich Ausgabe der Quadratzahl.
Eingabe mit prompt() - Ausgabe mit alert()
Jede Anweisung wird mit einem Semikolon abgeschlossen.
Die Variable (Speicher) links von dem Gleichheitszeichen wird
mit dem Inhalt / Ergebnis der rechten Seite gefüllt.
Die Seiten dürfen nicht vertauscht werden.
Quadrieren einer Zahl
TESTEN Nach oben Bemerkungen zu
|
Das eigentliche Programm besteht nur aus den drei Zeilen
05 (Eingabe) 06 (Verarbeitung) und (Ausgabe). x und y sind selbstgewählte Bezeichnungen für Variablen. Dagegen sind prompt und alert feste Ein- bzw. Ausgabefunktionen in Javascript. |
ANMERKUNG zur Ablaufsteuerung
Man kann an dem obigen Beispiel gut erkennen, dass hier keine Ereignissteuerung vorliegt (sobald das Programm abläuft): Die Maus wird hier überhaupt nicht benötigt.
Beispiel EVA (2): Eingabe zweier Zahlen, Verarbeitung = Addieren der beiden Zahlen, Ausgabe der Summe.
Umwandlung von Text in eine Zahl mit parseFloat()
Typische Fehlermeldung: NaN = not a number.
Addieren zweier Zahlen
TESTEN Nach oben Bemerkungen zum entscheidenden Unterschied der obigen Beispiele:
|
Beispiel PQ1: pq-Formel zur Lösung von quadratischen Gleichungen der Form x2+p*x+q = 0
pq-Formel (1) ohne Abfangen von Fehlern
TESTEN Nach oben |
Diese erste Lösung ist nur eine Vorstufe zu der folgenden Lösung.
In Zeile 09 wird mit der Alertbox der Lösungstext ausgegeben. Dieser setzt sich aus 4 Einzeltexten zusammen, die durch + aneinandergefügt werden. "x1=". Die Zeichen zwischen den Anführungszeichen werden direkt als Text ausgegeben. Direkt danach kommt x1 ohne Anführungszeichen. Nun wird der Inhalt der Variablen x1 ausgegeben, der, auch wenn dies eine Zahl ist, automatisch in einen Text verwandelt und auch so behandelt wird. |
Bedingte Anweisung: if (Bedingung) {Anweisung};
mit Alternative: if (Bedingung) {Anweisung} else {Alternativanweisung};
else = sonst
Standardfunktion Math.sqrt() = squareroot = Quadratwurzel
Mehrere Anweisungen werden durch geschweifte Klammern { und } in einem
Anweisungsblock (Verbundanweisung) zusammengefasst.
pq-Formel (2) mit Abfangen von Fehlern
TESTEN Nach oben |
Dies ist die eigentliche Lösung. Sie ist durch Abänderung / Verfeinerung aus der vorherigen Groblösung entstanden. Solche Verbesserungen kommen beim Programmieren häufig vor. |
Tipp zu nützlichen Übungen: Man kann in Phase5 (HTML-Edit) unter Datei "Neues HTML-Dokument" und dann "Leeres Dokument erstellen" auswählen *).
zunächst den Quelltext des zugehörigen Beispiels hinüberkopieren und entsprechend abändern. Hat es mit den Änderungen geklappt, sollte man sich unbedingt testen,
ob man den ganzen Quelltext auch ohne vorherige Kopie in eine leere HTML-Datei eintragen kann.
*)Natürlich kann man auch einen einfachen Text-Editor wie "Notepad" verwenden.
Die Datei muss hinterher die Endigung ".htm" oder ".html" bekommen.
Für die Wahl von Bezeichnungen gelten einfache Regeln: Das erste Zeichen muss ein Buchstabe sein, danach sind auch Ziffern erlaubt und es dürfen außer dem _ (Unterstrich) keine Sonderzeichen (z.B. auch nicht ä,ö,ü,ß) und keine Leerzeichen darin vorkommen. Groß- und Kleinschreibung werden unterschieden! Bei den Bezeichnungen muss man außerdem beachten, dass sie nicht zu den Javascript-Befehlswörtern gehören.
Alle Vergleichsoperatoren
= = gleich "=" | != ungleich "≠" |
< kleiner | <= kleiner oder gleich "≤" |
> größer | >= größer oder gleich "≤" |
if( BEDINGUNG ) { ANWEISUNG1; ANWEISUNG2; ... ; letzte ANWEISUNG };
Folge-ANWEISUNG ;
if( BEDINGUNG ) { ANWEISUNG1; ANWEISUNG2; ... ; letzte ANWEISUNG ;}
else
{ alternative ANWEISUNG1; alternative ANWEISUNG2; ... ; letzte alternative ANWEISUNG;}
Folge-ANWEISUNG;
FOR-Schleife (auch Zählschleife)
for ( Startwert der Zählvariablen ; Bedingung für Zählvariable ; Veränderung der Zählvariablen )
{ zu wiederholende Anweisungen };
Summe der Zahlen von 1 bis n (1+2+3+...+n)
TESTEN Nach oben |
In Zeile 06 muss die Variable summe den Wert 0 bekommen, weil sie sonst in Zeile 08 auf der rechten Seite beim ersten Durchlauf (für i=1) noch ohne definierten Inhalt wäre. In 07 ist i die Zählvariable (kann aber auch anders heißen z.B. zaehler). Die Schleife wird solange ausgeführt wie die Bedingung i<=n erfüllt ist. Die Veränderung der Schleifenvariablen i=i+1 erfolgt jeweils erst am Ende eines Durchlaufs. |
WHILE-Schleife (while = solange)
while ( Bedingung )
{ zu wiederholende Anweisungen };
Maximale Anzahl nmax der Summanden bis maxsumme. Maxsumme soll dabei nicht überschritten werden: 1 +2 +3 +...+nmax ≤ maxsumme |
||
TESTEN Nach oben |
Wenn die Anzahl der Wiederholungen nicht bekannt ist, kann man die Zählschleife (FOR-Schleife) natürlich nicht verwenden. Da hier die Anzahl nmax der Summanden bestimmt werden soll, wird in diesem Fall ausnahmsweise auch gezählt. Dies muss aber mit Zeile 06 und Zeile 09 selbst organisiert werden. Der Schritt zurück in den Zeilen 11 und 12 ist notwendig, weil beim letzten Durchlauf maxsumme gerade überschritten wurde, woraufhin die Bedingung in Zeile 08 noch weitere Schleifendurchläufe verhindert. |