JavaScript - Syntax: A Beginner's Guide
Hallo zusammen, zukünftige JavaScript-Zauberer! Ich freue mich sehr, euer Guide auf dieser aufregenden Reise in die Welt der JavaScript-Syntax zu sein. Als jemand, der seit Jahren Programmieren unterrichtet, kann ich euch sagen, dass das Beherrschen der Syntax so ist wie das Lernen des Alphabets, bevor man Gedichte schreibt. Es mag grundlegend erscheinen, aber es ist die Grundlage für alles, was wir gemeinsam aufbauen werden. Also, tauchen wir ein!
JavaScript Syntax: Die Bausteine des Codes
Die JavaScript-Syntax ist der Satz von Regeln, der definiert, wie JavaScript-Programme aufgebaut sind. Denkt daran wie die Grammatik der JavaScript-Sprache. Genau wie wir uns an Grammatikregeln halten müssen, um verständlich zu sprechen, müssen wir Syntaxregeln befolgen, damit unser Code für den Computer verständlich ist.
Dein erstes JavaScript-Code
Lassen wir mit einem einfachen "Hello, World!"-Programm beginnen. Dies ist oft das erste Programm, das man schreibt, wenn man eine neue Sprache lernt.
console.log("Hello, World!");
Wenn du diesen Code ausführst, siehst du "Hello, World!" in der Konsole ausgegeben. Lassen wir es auseinandernehmen:
-
console
ist ein Objekt, das von JavaScript bereitgestellt wird und uns Zugang zur Browser-Debugging-Konsole gibt. -
.log()
ist eine Methode des console-Objekts, die das übergebene Argument ausgibt. -
"Hello, World!"
ist eine Zeichenkette (eine Abfolge von Zeichen), die wir ausgeben möchten.
JavaScript-Werte
In JavaScript arbeiten wir mit verschiedenen Arten von Werten. Die Hauptarten sind:
- Zahlen:
42
,3.14
- Zeichenketten:
"Hello"
,'JavaScript'
- Booleans:
true
,false
- Objekte:
{name: "John", age: 30}
- Arrays:
[1, 2, 3, 4]
- Funktionen:
function greet() { console.log("Hi!"); }
Hier ist ein Beispiel, das verschiedene Arten von Werten verwendet:
let age = 25; // Number
let name = "Alice"; // String
let isStudent = true; // Boolean
let person = {name: "Bob", age: 30}; // Object
let numbers = [1, 2, 3, 4, 5]; // Array
console.log(age); // Ausgabe: 25
console.log(name); // Ausgabe: Alice
console.log(isStudent); // Ausgabe: true
console.log(person.name); // Ausgabe: Bob
console.log(numbers[2]); // Ausgabe: 3
Leerzeichen und Zeilenumbrüche
JavaScript ist sehr nachsichtig, wenn es um Leerzeichen (Spaces, Tabs und Zeilenumbrüche) geht. Du kannst sie verwenden, um deinen Code lesbarer zu machen, ohne seine Funktionalität zu beeinflussen.
let x = 5;
let y = 10;
let z = x + y;
// Dies ist äquivalent zu:
let x=5;let y=10;let z=x+y;
// Und sogar dies:
let x = 5
let y = 10
let z = x + y
Semikolons sind optional
In JavaScript sind Semikolons am Ende von Anweisungen optional. Es wird jedoch generell als gute Praxis angesehen, sie einzubeziehen.
let a = 5; // Mit Semikolon
let b = 10 // Ohne Semikolon
// Beide sind gültig, aber das Hinzufügen von Semikolons wird empfohlen
Gross- und Kleinschreibung
JavaScript ist grosschreibungssensibel. Das bedeutet, dass myVariable
, MyVariable
und MYVARIABLE
alle unterschiedliche Variablen sind.
let myVariable = "Hello";
let MyVariable = "World";
console.log(myVariable); // Ausgabe: Hello
console.log(MyVariable); // Ausgabe: World
JavaScript und Camel Case
Nach Konvention verwendet JavaScript Camel Case für Variablen- und Funktionsnamen. Das bedeutet, wir beginnen mit einem Kleinbuchstaben und kapitalisieren die erste Silbe jedes folgenden Wortes.
let firstName = "John";
let lastName = "Doe";
let fullName = firstName + " " + lastName;
console.log(fullName); // Ausgabe: John Doe
JavaScript-Schlüsselwörter
JavaScript hat eine Reihe von reservierten Wörtern, die du nicht als Variablennamen verwenden kannst. Diese werden als Schlüsselwörter bezeichnet. Hier sind einige gängige:
Schlüsselwort | Beschreibung |
---|---|
let | Declariert eine blockscoped Variable |
const | Declariert eine blockscoped, unveraenderliche Konstante |
if | Markiert einen Block von Anweisungen, der unter einer Bedingung ausgeführt wird |
for | Markiert einen Block von Anweisungen, der in einer Schleife ausgeführt wird |
function | Declariert eine Funktion |
return | Verlaesst eine Funktion |
true | Ein Boolean-Wert |
false | Ein Boolean-Wert |
JavaScript-Bezeichner
Ein Bezeichner ist ein Name, den du einer Variable, Funktion oder Eigenschaft gibst. Hier sind die Regeln für gueltige Bezeichner:
- Kann Buchstaben, Ziffern, Unterstriche und Dollarzeichen enthalten
- Muss mit einem Buchstaben, Unterstrich (_) oder Dollarzeichen ($) beginnen
- Grosschreibungssensibel
- Darf kein reserviertes Schlüsselwort sein
// Gueltige Bezeichner
let myVariable = 5;
let _privateVar = 10;
let $specialVar = 15;
// Ungueltige Bezeichner
// let 123abc = 20; // Kann nicht mit einer Ziffer beginnen
// let my-var = 25; // Kann keine Bindestriche verwenden
// let let = 30; // Kann keine reservierten Schlüsselwörter verwenden
Kommentare in JavaScript
Kommentare werden verwendet, um Notizen zu deinem Code hinzuzufuegen oder um bestimmte Teile des Codes von der Ausfuehrung auszuschliessen. Es gibt zwei Arten von Kommentaren in JavaScript:
// Dies ist ein Einzeilchen-Kommentar
/*
Dies ist ein
Mehrzeilchen-Kommentar
*/
let x = 5; // Du kannst auch Kommentare am Ende einer Zeile hinzufuegen
Operatoren in JavaScript
Operatoren werden verwendet, um Operationen auf Variablen und Werte durchzufuehren. Hier sind einige gängige Operatoren:
Operator | Beschreibung | Beispiel |
---|---|---|
+ | Addition | 5 + 3 |
- | Subtraktion | 5 - 3 |
* | Multiplikation | 5 * 3 |
/ | Division | 15 / 3 |
% | Modulus (Rest) | 5 % 2 |
++ | Inkrement | x++ |
-- | Dekrement | x-- |
== | Gleich | 5 == 5 |
=== | Strenge Gleichheit | 5 === "5" |
!= | Ungleich | 5 != 3 |
> | Groesser als | 5 > 3 |
< | Kleiner als | 3 < 5 |
Ausdruecke in JavaScript
Ein Ausdruck ist eine Kombination aus Werten, Variablen und Operatoren, die einen Wert bewertet. Hier sind einige Beispiele:
let x = 5;
let y = 3;
console.log(x + y); // Ausgabe: 8
console.log(x * y); // Ausgabe: 15
console.log(x > y); // Ausgabe: true
console.log(x === "5"); // Ausgabe: false
JavaScript-Zeichensatz
JavaScript verwendet den Unicode-Zeichensatz. Das bedeutet, es kann mit Zeichen aus vielen verschiedenen Sprachen und Emoji arbeiten! Hier ist ein spaßiges Beispiel:
let greeting = "Hello! ?";
let name = "Alice";
console.log(greeting + " " + name); // Ausgabe: Hello! ? Alice
Und das war's, Leute! Wir haben die Grundlagen der JavaScript-Syntax behandelt. Denkt daran, Übung macht den Meister. Es ist完全normal, wenn nicht alles sofort verstanden wird. Bleibt experimentierfreudig, bleibt codend und vor allem, spaßt euch daran! ?????
Credits: Image by storyset