JS – Teil 1: JavaScript lernen

JavaScript ist eine der wichtigsten Scriptsprachen der heutigen Zeit. Mit der immer weiter steigenden Verbreitung des Internets wird auch JavaScript immer beliebter und JavaScript zu lernen zahlt sich mehr und mehr aus. In dieser Artikelserie sehen wir uns gemeinsam die Grundlagen von JavaScript an, beleuchten wo wir es benutzen können und was es ausmacht. Vorkenntnisse sind dafür nicht benötigt, wir tasten uns Schritt für Schritt heran.
Und auch auf technischer Seite gibt es nur wenige Bedingungen – ein Browser und ein Texteditor und schon kann es losgehen. Legen wir los!

Wo wird JavaScript verwendet?

Die erste Frage, die wir uns stellen sollten, ist diese  – wo wird es verwendet und warum sollte ich JavaScript lernen?

Das vermutlich verbreitetste Anwendungsgebiet für JavaScript ist auf Webseiten. Der Lebenszyklus einer Webseite umfasst eine ganze Horde von Programmiersprachen und anderen Konstrukten.

  1. HTML – welches dem Browser mitteilt, wie die Struktur einer Webseite aussehen soll
  2. CSS – welches dem Browser mitteilt, wie diese Struktur gestaltet sein soll
  3. Möglicherweise PHP (oder andere serverseitige Programmiersprachen) – welches den Inhalt der Seite auf den jeweiligen Benutzer anpassen kann
  4. Möglicherweise MySQL (oder andere Datenbanksysteme) – welches Daten vom Nutzer dauerhaft Speichern und an anderer Stelle wieder ausgeben kann

Wie wir an dieser Auflistung sehen ist hier die Logik (PHP und MySQL), die auf dem Server stattfindet, ganz klar von der Anzeige (HTML und CSS), die im Browser stattfindet, getrennt.
Doch was machen wir, wenn wir Logik im Browser machen? Weder HTML noch CSS bieten uns die Möglichkeit, logische Entscheidungen zu treffen. Genau hier kommt JavaScript ins Spiel.

Quasi jeder moderne Browser hat die Fähigkeit, JavaScript zu verstehen und auszuführen. Das bietet uns die Möglichkeit, unsere Webseiten dynamischer zu gestalten. Soll vielleicht etwas passieren, wenn der User an eine bestimmte Stelle klickt? Oder die Maus bewegt? Oder eine Taste drückt?

 

 

Einige bekannte Beispiele für den Einsatz von JavaScript:

  • Endlosscrolling – Bei Facebook können wir endlos nach unten scrollen, es tauchen immer weitere Inhalte auf. Diese werden einfach dynamisch nachgeladen sobald wir uns dem Ende der Seite nähern.
  • Autocomplete – Google weiß meist schon nach wenigen Zeichen, was wir eigentlich schreiben wollen. Dafür werden unsere eingegebenen Zeichen per JavaScript an den Server gesendet und dort ausgewertet um uns Vorschläge machen zu können.
  • Bildergalerien im Overlay – Man klickt auf ein Bild und es öffnet sich ein Overlay über die gesamte Seite in dem die Bildergalerie geladen wird. Neben dem CSS, das für die Gestaltung sorgt, kommt auch hier JavaScript zum Einsatz.

Neben der Verwendung im Browser und auf Webseiten verbreitet JavaScript sich allerdings auch in anderen Bereichen mehr und mehr. Ein Beispiel dafür wäre – mit der Entwicklung von NodeJS – die Möglichkeit, JavaScript auch auf dem Server zum Einsatz zu bringen und so auf andere serverseitige Scriptsprachen wie PHP zu verzichten. Auch die Gameengine Unity bietet die Möglichkeit, echte Videospiele mit JavaScript zu programmieren. Wir sehen also – JavaScript lernen lohnt sich!

 

Was benötigen wir um loszulegen?

Ein guter Grund um JavaScript zu lernen liegt neben der grundsätzlich einfachen Handhabung darin, dass die Einstiegshürde extrem niedrig ist. Bei Programmiersprachen wie C oder Java benötigten wir komplizierte IDEs und andere Programme wie Compiler und müssen diese einrichten, bevor wir das erste Ergebnis sehen können – eine Hürde an der sicherlich schon viele Personen gescheitert sind.

In JavaScript hingegen ist das loslegen ganz einfach. Folgende Dinge brauchen wir:

  1. Texteditor – egal ob Notepad, Notepad++,  Sublime oder andere: Hauptsache wir können damit Text bearbeiten!
  2. Browser – Chrome, Firefox, Safari, Opera – egal was dein bevorzugter Browser ist, alle können sie JavaScript.

Und das wars schon. Vermutlich musstest du nicht mal etwas neues installieren denn so ziemlich jeder Computer kommt mit diesen Programmen.

Aber bevor wir den ersten Teil der Serie abschließen brauchen wir natürlich noch ein Erfolgserlebnis. Also schreiben wir unser erstes Programm.

 

Hallo Welt

Lege eine neue Datei an und nenn diese index.htm. Die Dateiendung sagt deinem Betriebssystem vermutlich Öffne mich mit einem Browser wenn du darauf doppelklickst. Sollte das nicht der Fall sein mach einen Rechtsklick und Öffnen mit und wähle hier den Browser deiner Wahl aus. Noch siehst du rein gar nichts, denn diese Datei enthält weder HTML noch sonst irgendetwas – daher die weiße Seite.

Nun öffnen wir die Datei in unserem Texteditor und fügen folgenden Text ein:

Wir speichern die Datei ab und öffnen sie erneut im Browser. Wenn alles funktioniert hat bekommen wir eine kleine Box mit dem Text Hallo Welt. Glückwunsch. Wir haben soeben JavaScript programmiert!

In den nächsten Teilen der Serie lernen wir, was gerade passiert ist und beginnen dann Schritt für Schritt mit den Einzelheiten der Sprache.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*