Elter Programmieren lernen mit JavaScript

4. Auflage 2025
ISBN: 978-3-367-10831-2
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection

E-Book, Deutsch, 429 Seiten

Reihe: Rheinwerk Computing

Entdecke mit JavaScript die Sprache, die hinter fast jeder Webseite steckt, und programmiere Spiele und Anwendungen, die einfach Spaß machen. Steig direkt ein, du brauchst nur deinen Computer und dieses Buch. Es zeigt dir alles von den ersten Befehlen bis zu Grafik und Animation - Schritt für Schritt und an vielen Beispielen. Deine Programme kannst du direkt im Browser laufen lassen und leicht an Freunde weitergeben, ganz unabhängig vom Betriebssystem. Ran an die Tasten, fertig, los!

Aus dem Inhalt:

• Einstieg mit Browser und Texteditor
• Erste Schritte mit JavaScript und HTML
• Quiz, Rechenkönig, Textadventure
• Ein Grafik-Framework benutzen
• Fehler finden
• Farben und Animationen
• Inhaltspunkt
• Diagramme erstellen
• Objektorientiert programmieren
• Tetris nachprogrammieren
• Künstliche Intelligenz nutzen

Stephan Elter ist Softwareentwickler und verwendet JavaScript seit vielen Jahren - neben PHP, Java und einer Menge anderer Sprachen. Programmieren macht ihm Spaß, er liebt witzige Beispiele und würde niemals ein Buch schreiben, in dem jeder Satz hundertprozentig ernst gemeint ist.

Autoren/Hrsg.

Elter, Stephan

Inhaltsverzeichnis

Vorwort ... 17  Materialien zum Buch ... 18  Über dieses Buch ... 19  1.  HTML ... 33  Die Befehle -- Tags ... 34  Deine erste Webseite ... 41  Tags tieferlegen und verchromen -- Attribute ... 45  2.  Hallo Welt ... 49  So kommen Programme in die Webseite ... 50  Ein kleines Meldungsfenster -- der Einstieg ... 52  Und so kommt das JavaScript in die Webseite ... 53  Das Handy fällt nicht weit vom Stamm -- der gute alte Galileo und warum auch Formeln Spaß machen ... 57  Wie schreibe ich »?« in JavaScript? ... 58  Wohin mit dem Ergebnis? ... 59  Allheilmittel gegen Vergesslichkeit -- die Variablen ... 63  Vom Handyweitwurf zum ersten Spiel ... 68  Lasst die Spiele beginnen ... 74  Die erste Schleife geht auch ohne Schnürsenkel ... 75  Waren da hinten nicht gerade noch der Bernd und die Alfi? Dort, wo jetzt das Monster steht? ... 78  Falls es mal nicht klappt ... 81  3.  Zufall, Spaß und Logik ... 85  Zahlen raten ... 86  Die Anleitung haben wir -- bauen wir unser Programm ... 87  Was macht der Programmcode denn da? ... 89  »Hey, mach's noch mal« -- Schleifen mit »do-while« ... 92  Das fertige Programm ... 94  Schere, Stein, Papier ... 98  Das »if« und das »else« ... 105  Sag mal, stimmt die Formel so? Formeln, Bauchgefühle, Tests ... 107  4.  CodeBreaker ... 111  Die geheime Zahl ... 112  Von der Beschreibung zum Programm ... 113  Nur der Teufel steckt so tief im Detail und alle, die programmieren -- »else if« ... 118  Tunen, tieferlegen, lackieren und Locken eindrehen ... 124  JavaScript über Klicks auf HTML-Elemente aufrufen ... 129  5.  Bubbles, Blasen und Arrays ... 137  Erst einmal alles fürs Sortieren ... 138  Arrays -- die Vereinsmeier unter den Variablen ... 138  Werte lesen, schreiben und auch wieder vergessen ... 140  The sort must go on ... oder so ähnlich ... 142  Bubblesort mit Computer ... 144  Feinschliff ... 151  Das Ende der weißen Seiten ist nahe ... 157  Etwas schicke Kosmetik ... 165  Die volle Funktion für Bubblesort ... 165  6.  Quiz ... 169  Tieferlegen und verchromen -- alles mit CSS ... 175  Dreimal darfst du raten ... 178  Vom richtigen Mischen und von anonymen Funktionen ... 185  Die Sache mit der Henne, dem Ei und dem besten Anfang ... 188  Das Quiz starten ... 193  7.  Rechenkönig ... 201  Die Benutzeroberfläche ... 202  Zuerst die Funktionen und die Variablen ... 206  Der Spieler ist am Zug ... 218  Das Programm als Ganzes ... 220  Nicht für die Ewigkeit -- aber länger als nur für eine Sitzung ... 223  8.  Textadventure ... 233  Wie setzen wir das um? ... 235  JSON -- ein kuscheliges Zuhause für Daten und Geschichten ... 238  Zeit für etwas HTML und CSS ... 242  Von JSON zu JavaScript ... 246  Zuerst die grundlegende Funktionalität -- der Prototyp ... 250  Nach dem Prototyp ... 254  Aus den Nummern die wirklichen Texte holen ... 256  Teile und herrsche -- mehr als nur eine Datei ... 262  9.  Hammurabi ... 269  Wie funktioniert das Spiel? ... 270  Die Regeln -- im Detail ... 274  Unsere Zufallszahlen ... 286  Eine Spielrunde -- ein ganzes Jahr ... 288  Das ganze Programm in einem Rutsch ... 299

10.  Charts und Bibliotheken ... 305  Chartis.js ... 307  Zeit für eigene Daten ... 316

11.  Mondlandung ... 331  Was brauchen wir auf unserer Webseite? ... 332  Schöner abstürzen ... ... 334  Ein paar Funktionen wären auch ganz hilfreich ... 334  Auch das schönste Programm ist nichts ohne eine Ausgabe ... 338  Etwas Kontrolle muss sein ... 341  Schöner fallen mit Canvas und JavaScript ... 344

12.  Im Tal der fallenden Steine ... 353  Die HTML-Datei ... 354  Der Code ... 355

13.  Objekte, Orakel, Schiffe und Seeungeheuer ... 367  Klassen, Objekte und die alten Griechen ... 368  Ein Orakel und die erste eigene Klasse ... 369  Noch eine Schippe OOP obendrauf ... 377  Einmal das volle Programm, bitte ... 378  Setzt die Segel! ... 379  So schreiben wir unser Programm ... 380  Eine Karte für die hohe See ... 382  Das Schiff ... 387  Eine Steuerung -- ganz klassisch ... 389  Die Klasse »Karte« ... 391  Die Klasse »Schiff« ... 393  Und noch die Steuerung ... 394

14.  Würfel, Torus, Raumschiffe ... 395  Three.js -- woher nehmen und nicht stehlen? ... 396  Das erste Mal in 3D -- fast wie am Filmset ... 398  Und hier der Code am Stück ... 404  Ein Raumschiff -- ganz klassisch ... 406

15.  Zahlen, Buchstaben und KI ... 413  Was fange ich mit künstlicher Intelligenz an? ... 414  Zeit für einen Test ... 419  Und jetzt noch einmal alles am Stück ... 421  Mehr KI und JavaScript ... 425  Index ... 427

Leseproben

Über dieses Buch

Programmieren lernen – das Richtige für dich?

Für wen ist dieses Buch geeignet – und für wen ist es ganz besonders geeignet? Natürlich geht es ums Programmieren, um echtes Programmieren mit Spielen und einer ganzen Menge Spaß. Ist dieses Buch also das Richtige für dich?

Beschäftigt man sich zum ersten Mal mit dem Thema »Programmieren«, scheint es sich eher um eine geheime Kunst zu handeln, die nur wenige Eingeweihte beherrschen. Mysteriöse Begriffe schwirren umher, das meiste scheint kaum verständlich. Vielleicht brummt dir der Kopf schon nach den ersten Versuchen? Zeit für dieses Buch!

Bin ich hier richtig?

Es geht in diesem Buch ums Programmieren und darum, wie du deine eigenen Ideen in Programme umsetzen kannst. Du lernst also nicht nur die Befehle und Anweisungen einer Programmiersprache, sondern ich zeige dir in diesem Buch auch, wie du deine Ideen sinnvoll formulierst und dann als Computerprogramm schreibst.

In (fast) jedem Kapitel stelle ich ein kurzes, meist einfaches Spiel vor. Wie musst du vorgehen, um dieses Spiel in ein Programm umzusetzen? In jedem Kapitel lernst du außerdem ein paar neue Befehle und Möglichkeiten der Programmierung kennen. Büffeln musst du dabei eigentlich gar nichts – wichtiger ist der Spaß daran.

Wenn du also ein Buch für einen durchaus ernsthaften Einstieg in die Welt der Programmierung suchst, aber auch dem Spaß nicht vollends abgeneigt bist, dann bist du hier richtig. Du willst das Programmieren für dich selbst lernen? Du suchst Hilfe für den Informatikunterricht oder die letzte Rettung für begleitende Informatikkurse im Studium oder in der Ausbildung? Wenn es dabei ums Programmieren geht und es JavaScript sein darf, bist du hier richtig.

Komplexe UIs unter Verwendung komplexer Frameworks?

Du kannst bereits programmieren? Du willst ein komplexes User Interface (UI) für das Frontend deiner Website bauen? Du suchst ein Buch über Oberflächen- und Webseitenprogrammierung mit JavaScript, jQuery und anderen Frameworks wie AngularJS oder React? Du willst per AJAX asynchrone Datenübertragung realisieren? Dann ist dieses Buch nicht die erste Wahl – es sei denn, du hast gerade erst angefangen zu programmieren und möchtest noch etwas üben, ohne viele Themen auf einmal zu beginnen. Denn die üblichen Themen klassischer JavaScript-Bücher wie Web- und Oberflächenentwicklung, die sich an erfahrene Entwickler richten, aber nicht zu einem Einstieg in die Programmierung taugen, werden hier nur am Rande behandelt. Hier geht es um deinen Einstieg in die Programmierung.

Programmieren ist doch Mathematik, viel Mathematik?

Es ist ein Irrglaube, dass gute (oder sogar sehr gute) Mathematikkenntnisse eine zwingende Voraussetzung seien, um programmieren zu können. Sicher, ein gesundes Grundverständnis von Zahlen und allgemeinen Rechenoperationen schadet zumindest nicht. Aber das ist es eigentlich auch schon. Berechnungen führt der Computer durch. Notwendige Formeln findest du zumeist im Internet. Auch wenn du kein mathematisches Genie sein solltest, wirst du dennoch in der Lage sein, Programme zu schreiben. Viel wichtiger sind gute Ideen, etwas Ausdauer und Spaß an kniffligen Rätseln und Aufgaben.

Und wenn du erst einmal erlebt hast, wie der Computer mathematische Probleme und Schwierigkeiten erleichtert und knackt, macht dir Mathematik gleich doppelt so viel Spaß.

Was du brauchst

Du benötigst nicht viel. Hast du einen Computer, der schnell genug ist, um damit im Internet zu surfen, oder mit dem du Textverarbeitung machen kannst? Du hast einen Browser wie Chrome, Safari oder Firefox? Du weißt, wie du am Computer Texte schreibst und speicherst? Dann hast du eigentlich schon alles, was du brauchst. Es ist übrigens egal, ob du einen PC mit Windows oder Linux verwendest oder einen Mac. Was ich dir hier zeigen werde, kannst du tatsächlich überall einsetzen.

Warum JavaScript?

Natürlich ist es nicht egal, mit welcher Programmiersprache du beginnst. Wir nehmen deshalb eine Sprache, die Ähnlichkeiten mit den Großen der Szene hat, also mit C/C++, Java, C# und PHP, eine Programmiersprache, die selbst eine bekannte Größe ist und ursprünglich für das Internet entwickelt wurde.

Aber warum ist JavaScript denn so toll, um das Programmieren zu lernen?

Keine Installation – keine Konfiguration – keine Sorgen

JavaScript ist auf nahezu jedem Computer verfügbar, denn ein Browser, der JavaScript ausführen kann, gehört heute zur Grundausstattung aller gängigen Betriebssysteme.

So toll andere Programmiersprachen auch sind: Du musst erst eine Laufzeitumgebung oder einen Compiler installieren, einen leistungsfähigen Editor oder noch besser eine komplexe IDE. Eine Menge Wissen und Vorarbeit sind notwendig, um nur die kleinsten Dinge auf den Bildschirm zu zaubern. Und solange du beispielsweise nicht weißt, was public static void main(String[] args){} bedeutet, kannst du nur wenig machen. JavaScript ist da anders, ganz anders: Du schreibst deine JavaScript-Programme in einfache Webseiten (und die sind eigentlich auch nur einfache Textdateien) und schaust dir das Resultat direkt im Browser (also in Google Chrome, Edge, Firefox oder Safari) an. Die Browser haben einen eingebauten Übersetzer, einen Interpreter für JavaScript, der deine Programme wie von Zauberhand übersetzt und ausführt.

Das heißt für dich: Keine Suche nach Software, keine Installation, keine Ärgernisse, weil irgendwelche Systemeinstellungen oder Berechtigungen gesetzt werden müssen.

JavaScript ist sicher

Du nutzt den teuren (oder treuen) Laptop der Familie oder das Arbeitsgerät von Onkel Oswald? Kein Problem: JavaScript kann nichts kaputtmachen. JavaScript kann keine Dateien löschen oder verändern, die sich auf dem Computer befinden. Alles läuft in einer sicheren (sogenannten) Sandbox ab. Damit kein schädliches Programm aus dem Internet Schaden am Computer anrichten kann, hat man bei der Entwicklung entschieden, dass JavaScript bestimmte Dinge eben nicht machen darf – dazu gehört das Löschen oder Verändern von Dateien. Der einfachste Weg, solche Aktionen zu verhindern, war, diese Fähigkeiten erst gar nicht einzubauen. JavaScript »lebt« quasi innerhalb der Browser – und nur und ausschließlich dort. Natürlich kannst du trotzdem Daten speichern, aber eben geschützt innerhalb des Browsers.

JavaScript ist eine dynamisch typisierte Sprache

JavaScript gehört zu den dynamisch typisierten Sprachen. Kling kompliziert, ist aber ganz einfach: Eine Variable (das ist ein kleiner Speicher) kann beliebige Werte aufnehmen – egal, ob es eine Zahl ist, ein Wort oder ein Wahrheitswert (0 oder 1 bzw. true oder false). Treffen solche unterschiedlichen Werte aufeinander, kümmert sich JavaScript darum, alles korrekt zusammenzubringen. Du brauchst dir über solche Dinge keine Gedanken zu machen – du kannst dich gleich ins Programmieren stürzen.

Andere Sprachen wie Java oder C# sind da wesentlich strenger: Eine Variable muss vor der Verwendung dauerhaft auf eine Art von Wert festgelegt werden, sonst gibt es einen Fehler. Willst du eine Zahl und einen Text in irgendeiner Form zusammenbringen, musst du die Werte erst konvertieren. Das ist statische Typisierung. Das bringt bei (sehr) großen Programmen mehr Sicherheit, die Entwicklung ist aber aufwendiger.

Entwickler*innen führen immer wieder lange Diskussionen, ob die dynamische oder die strenge Typisierung der Weg zum Glück sind. Das braucht dich aber nicht zu kümmern.

Falls du es genauer wissen willst: Interpretiert oder kompiliert

Mit Programmen, wie du sie schreibst, kann ein Computer noch nicht viel anfangen – sie müssen erst in sogenannte Maschinensprache übersetzt werden. Manche Sprachen werden interpretiert, manche kompiliert. Der Unterschied ist einfach: Mit Sprachen, die kompiliert werden, können direkt ausführbare Programme generiert werden. Unter Windows sind das die klassischen .exe-Dateien, die mit einem Doppelklick gestartet werden. Interpreter-Sprachen werden jedes Mal aufs Neue aus dem Quellcode (also der Textdatei, in der du dein Programm geschrieben hast) übersetzt und dann ausgeführt. Man hat keine (echten) ausführbaren Dateien, sondern benötigt immer einen Interpreter bzw. eine sogenannte Laufzeitumgebung für die Umsetzung und Ausführung. Für JavaScript übernimmt der Browser diese Aufgabe: Er hat einen solchen JavaScript-Interpreter an Bord.

Eine klassische Compilersprache ist C/C++. Interpreter-Sprachen sind PHP, Python, Ruby und natürlich JavaScript. Und es gibt Sprachen, die zwar kompiliert werden – in sogenannten Bytecode –, aber erst bei der Ausführung des Programms in Maschinensprache interpretiert werden. Dazu gehören Java, C# oder auch VB.NET.

Früher war es einfach: Kompilierte Programme waren viel schneller. Es war gar nicht sinnvoll, Programme nicht zu kompilieren. Heute hat sich das geändert. Die Prozessoren...

Über Autor(innen)

Elter, Stephan
Stephan Elter ist Softwareentwickler und verwendet JavaScript seit vielen Jahren – neben PHP, Java und einer Menge anderer Sprachen. Programmieren macht ihm Spaß, er liebt witzige Beispiele und würde niemals ein Buch schreiben, in dem jeder Satz hundertprozentig ernst gemeint ist.