JavaScript: Funktion, Vor- & Nachteile

JavaScript

Alles was du wissen musst

JavaScript ist keine Programmiersprache im klassischen Sinne, sondern eine Skriptsprache, mit der Webseiten interaktiv gestaltet werden. Diese Skriptsprache ist das, was einer Webseite Leben gibt – die interaktiven Elemente und Animationen, die einen Benutzer interessieren. Wenn Du jemals ein Suchfeld auf einer Homepage verwendet, das Live-Ergebnis einer Fußballspiels auf einer Nachrichtenseite überprüft oder ein Video oder eine Animation angesehen hast, wurde wahrscheinlich JavaScript benutzt.

Was ist JavaScript?

JavaScript (JS) ist eine Programmier- bzw. Skriptsprache, die hauptsächlich im Web verwendet wird. Sie wird zur Verbesserung und Interaktivität von HTML-Seiten eingesetzt und ist häufig in HTML-Code eingebettet. JavaScript ist eine interpretierte Sprache. Das bedeutet: Der Code muss nicht kompiliert werden. Das auch als Scriptsprache bezeichnete JavaScript rendert Webseiten auf interaktive und dynamische Weise. Auf diese Weise können die Seiten auf Ereignisse reagieren, Spezialeffekte aufweisen, variablen Text akzeptieren, Daten validieren, Cookies erstellen, den Browser eines Benutzers erkennen und vieles mehr.
JavaScript arbeitet dabei clientbasiert, d.h. die Interpretation des Codes und Berechnungen werden auf dem Clientrechner ausgeführt, nicht auf dem Server.
Mittlerweile gibt es jedoch bereits Frameworks wie z.B. Node.js, die die Verwendung von JavaScript auf bzw. als Server ermöglichen.

HTML-Seiten eignen sich gut zur Anzeige statischer Inhalte wie zum Beispiel eines einfachen Bildes oder Textes. Die meisten Seiten sind heutzutage jedoch nicht mehr statisch. Viele der modernen Seiten enthalten Menüs, Formulare, Diashows und sogar Bilder und Videos, die eine Benutzerinteraktion ermöglichen. JavaScript ist die Sprache, die von Webentwicklern verwendet wird, um eine solche Interaktion bereitzustellen. Da JavaScript mit HTML-Seiten funktioniert, sollte ein Entwickler HTML-Kenntnisse besitzen und sich im DOM einer Webseite auskennen, um das volle Potenzial dieser Skriptsprache nutzen zu können. Obwohl es noch andere Scriptsprachen für interaktive Webseiten gibt, wird in der Praxis hauptsächlich JavaScript verwendet.

Abriss zur Geschichte von JavaScript

Die Entwicklung von JavaScript begann 1995 bei Netscape Communications, dem Entwickler des Netscape-Browsers. Die Entwickler stellten fest, dass das Hinzufügen einer Script-Sprache zur Verbesserung der Webbenutzererfahrung führte und die Benutzerakzeptanz erhöhte. Also versuchten sie eine “Programmiersprache” in HTML einzubetten. Da Java zu dieser Zeit die neue und gehypte Programmiersprache war, beschlossen sie, die Script-Sprache in der Syntax näher an Java heranzuführen. Das Ergebnis war JavaScript mit Funktionen von HTML, der Objektorientierung von SmallTalk und der Syntax von Java. Die erste Version dieser Sprache hieß im Mai 1995 Mocha, wurde im September 1995 in LiveScript umbenannt und im Dezember 1995 erneut in JavaScript umbenannt.

1996 wurde JavaScript zur Fertigstellung als Standardspezifikation an die ECMA International übermittelt. ECMA ist eine Gesellschaft zur Normierung von Kommunikations- und Informationssystemen in Genf in der Schweiz. Im Juni 1997 wurde die erste offizielle Spezifikation für die Sprache als ECMA-262 veröffentlicht. Die neueste Version der Sprache ist ECMAScript 2017, die im Juni 2017 veröffentlicht wurde.

Ist JavaScript ähnlich zu Java?

JavaScript und Java sind zwei verschiedene Computersprachen, die beide 1995 entwickelt wurden. Java ist eine objektorientierte Programmiersprache. Zudem ist Java plattformunabhängig. Das heißt, die Sprache kann unabhängig von der Maschine in einer virtuellen Umgebung (virtuelle Maschine) ausgeführt werden. Java ist eine zuverlässige, vielseitige Sprache, die für Android-Apps, Unternehmenssysteme, die große Datenmengen (insbesondere in der Finanzbranche) übertragen, und eingebettete Funktionen im Bereich der “Internet of Things” -Technologien (IoT) verwendet wird.

Als JavaScript entwickelt wurde, sollte es eine Ergänzung zu Java sein. Aber JavaScript hat als eine der drei Säulen der Webentwicklung (neben HTML und CSS aka Cascadingt Style Sheets) ein Eigenleben erlangt. Im Gegensatz zu Java-Anwendungen, die kompiliert werden müssen, bevor sie in einer webbasierten Umgebung ausgeführt werden können, wurde JavaScript absichtlich für die Integration in HTML entwickelt. Alle gängigen Webbrowser unterstützen JavaScript , die meisten bieten jedoch ebenso die Möglichkeit, die Unterstützung für JavaScript aus Sicherheitsgründen zu deaktivieren.

Wie funktioniert JavaScript?

Es gibt zwei Möglichkeiten, JavaScript in einer HTML-Datei zu verwenden. Bei der ersten Methode wird der gesamte JavaScript-Code in den HTML-Code eingebettet. Diese Variante nennt man “Inlince Code”.

JavaScript direkt im HTML-File notieren

Beispiel eines direkt in HTML eingebundenen Inline-Codes:

<html>
    <head>
        <script>
            alert("Hallo Welt!");
        </script>
    </head>
    <body>
    </body>
</html>

JavaScript in eigenem File notieren und aus dem HTML-File referenzieren

Bei der zweiten Methode wird eine separate JavaScript-Datei verwendet, die aus einem Script-Element aufgerufen wird und von Script-Tags eingeschlossen wird. JavaScript-Dateien sind durch die Erweiterung .js gekennzeichnet.

Beispiel JavaScript-File (echo.js):

function HelloWorldEcho() {
  var HelloEcho  = document.getElementById('Eingabe');
  alert("Du hast gesagt: " + Eingabe.value);
}

var say  = document.getElementById('shout');
los.addEventListener ('click', HelloWorldEcho, true);

Beispiel HTML-File mit Einbindung:

<html>
    <head>
    </head>
    <body>
         <h1>Referenzierung externes JavaScript</h1>
         <main>
            <input type="text" id="Eingabe" value="test">
            <button type="button" id="shout">Echo ausgeben</button>
        </main>
    <script src="echo.js"></script>
    </body>
</html>

Tipp: Wenn möglich, solltest Du die Variante zwei, also die Notierung von JavaScript in einem extra-File und die anschließende Referenzierung im HTML-Dokument wählen. Diese Einbindugn ist “sauberer” und lässt Deinen Code weniger schnell unstrukturiert werden.

Videos von YouTube werden aus Gründen des Datenschutzes erst angezeigt, wenn die Entsprechenden Cookies akzeptiert wurden. Bitte akzeptiere statistik, Marketing cookies, um das Video zu sehen.

Obwohl JavaScript hauptsächlich für die Interaktion mit HTML-Objekten verwendet wird, kann es auch für die Interaktion mit anderen Nicht-HTML-Objekten wie Browser-Plugins, CSS-Eigenschaften, dem aktuellen Datum oder dem Browser selbst verwendet werden. Zum Schreiben von JavaScript-Code wird lediglich ein einfacher Texteditor wie Notepad unter Windows, Gimp unter Linux oder BBEdit benötigt. Einige Texteditoren, wie BBEdit, heben die Syntax für JavaScript hervor. Auf diese Weise können die Elemente von JavaScript-Code leicht identifiziert werden.

Wann und Wo wird JavaScript ausgeführt?

Dadurch, dass JavaScipt clientbasiert ausgeführt wird, bietet es die Möglichkeit, ohne einen Seitenreload die betreffende Webseite dynamisch zu verändern (und auf Inhalte zuzugreifen).
Unter anderem kann so auch dynamisch Inhalt nachgeladen oder übermittelt werden, ohne einen Reload der gesamten Webseite zu veranlassen. Dieses Konzept wird auch als “AJAX” (Asynchronous JavaScript and XML) bezeichnet.
JavaScript ermöglicht eine Webseite, die mit den Besuchern interagieren kann, ohne dass diese bei jeder Anforderung auf das Laden einer neuen Seite warten müssen. JavaScript fügt der Webseite ein Verhalten hinzu , bei dem die Seite auf Aktionen reagiert, ohne dass eine neue Seite geladen werden muss, um die Anforderung zu verarbeiten.
Ein Besucher muss zum Beispiel nicht mehr ein komplettes Formular ausfüllen und abschicken, um zu erfahren, dass er im ersten Feld einen Tippfehler gemacht hat und alles erneut eingeben muss. Mit JavaScript kann jedes der Felder beim Eingeben validieren und sofort eine Rückmeldung geben, wenn sie fehlerhaft sind.

Wie kann ich JavaScript lernen?

Wenn Du bereit bist, in die Welt der Webentwicklung einzutauchen und HTML und grundlegendeMarkup-Language bereits kennst, ist es Zeit, JavaScript (JS) zu lernen. Diese Computersprache wird hauptsächlich zum Erstellen und Verbessern der interaktiven Aspekte von Websites verwendet.
Es gibt viele kostenlose und kostenpflichtige Optionen, um JS online zu lernen. Viele Websites bieten kostenlose Kurse und Tutorien an. Du kannst auch ein Lehrbuch kaufen oder herunterladen, das die verschiedenen Aspekte des Sprache abdeckt und dieses beispielsweise im Urlaub lesen. Das Erlernen der Sprache ist nicht besonders schwierig, besonders wenn Du bereits über Kenntnisse anderer Programmiersprachen verfügst. Alles was Du brauchst ist ein wenig Zeit, Engagement, Selbstdisziplin und Lernbereitschaft.

Die kostenpflichtigen Websites eignen sich für aktuelle oder zukünftige Fachkräfte, die eine gründlichere strukturierte Einführung in die Sprache wünschen. Ob die bezahlten Websites den Preis wert sind, hängt ganz von Deinen Erwartungen ab und davon, ob Du eine Zertifizierung in JavaScript anstrebst, was eine wertvolle Ergänzung zu Deinem Lebenslauf darstellt.
Ich bin persönlich eher der Typ, der sich ein Fachbuch kauft und dieses direkt neben dem Computer liegen hat. So kann man direkt loslegen und die oftmals in den Büchern gestellten Praxisbeispiele/-Aufgaben nebenher am Computer bearbeiten.

Viele komplette Java-Kurse findet man z.B. auch auf YouTube:

https://youtube.com/watch?v=videoseries&list=PLNmsVeXQZj7qOfMI2ZNk-LXUAiXKrwDIi

Wie kann ich JavaScript beim Entwickeln nutzen?

JavaScript ist unglaublich vielseitig und anfängerfreundlich. Wenn Du etwas Erfahrung mit dieser Skriptsprache gesammelt hast, kannst Du Spiele, später sogar animierte 2D- und 3D-Grafiken, umfassende datenbankgesteuerte Apps und vieles mehr erstellen.
JavaScript selbst ist recht kompakt und dennoch sehr flexibel. Die Entwicklergemeinde hat eine Vielzahl von Tools implementiert, um mit minimalem Aufwand eine Vielzahl zusätzlicher Funktionen freizuschalten. Diese schließen ein:

  • Browser Application Programming Interfaces (APIs) – APIs, die in Webbrowsern integriert sind und Funktionen wie das dynamische Erstellen von HTML und das Festlegen von CSS-Stilen, das Sammeln und Bearbeiten eines Videostreams von der Webcam des Benutzers oder das Generieren von 3D-Grafiken und Audiobeispielen bereitstellen.
  • Drittanbieter-APIs – Ermöglichen Entwicklern die Einbindung von Funktionen in ihre Websites von anderen Inhaltsanbietern wie Twitter oder Facebook.
  • Frameworks und Bibliotheken von Drittanbietern – Du kannst diese in deinem HTML-Code verwenden, um schnell Websites und Anwendungen zu erstellen oder Deinen Seiten eine neue Dimension von Leistung oder Kreativität zu verleihen.

JavaScript Frameworks erleichtern die Entwicklung von Webseiten

Beim Programmieren von Webseiten kannst Du natürlich den gesamten Code von Grund auf selber erstellen. Das ist jedoch unglaublich zeitaufwendig und oftmals sinnfrei: Man muss das Rad nicht neu erfinden. Besser ist es, vorhandenen Code zu benutzen und an die eigenen Bedürfnisse anzupassen. Und hier kommen JavaScript-Frameworks ins Spiel.
JS-Frameworks sind im Grunde genommen Sammlungen von JavaScript-Codebibliotheken, die Entwicklern vorab geschriebenen JS-Code für Routineprogrammierungsfunktionen und -aufgaben wie das Erstellen von Websites oder Webanwendungen bereitstellen.
Die Vorteile der Verwendung von JavaScript-Frameworks liegen in der Effizienz und Organisation, die sie für ein JS-Projekt mit sich bringen. Dein Code ist ordentlich strukturiert und das Framework bietet vorgefertigte Lösungen für häufig auftretende Codierungsprobleme.
Auch die Fehlerbehebung kann sich vereinfachen, da die meisten Probleme, die in Zusmmenhang mit einem etablierten Framework aufkommen, höchst wahrscheinlich auch einem anderen Verwender schon einmal aufgetreten und behandelt worden sind.

Fazit

JavaScript ist eine leistungsfähige Programmiersprache, die einer statischen Webseite viele Funktionen hinzufügen kann. Heutzutage enthalten fast alle Webseiten JavaScript, eine Skriptsprache, die im Webbrowser des Besuchers ausgeführt wird. JavaScript macht Webseiten für bestimmte Zwecke funktionsfähig und interaktiv. Sollte die Ausführung jedoch im Browser aus irgendeinem Grund deaktiviert werden, kann der Inhalt oder die Funktionalität der Webseite eingeschränkt oder nicht verfügbar sein.


Bildnachweis Headerbild: https://mangomattermedia.com/

Rückmeldungen