JavaScript - Variablen

Hallo da, zukünftiger Codingsuperstar! ? Willkommen auf unserer aufregenden Reise in die Welt der JavaScript-Variablen. Als dein freundlicher Nachbarschaftsinformatiklehrer bin ich begeistert, dich durch dieses grundlegende Konzept zu führen. Also, nimm deinen virtuellen Denkkappe und tauchen wir ein!

JavaScript - Variables

JavaScript Variablen

Stell dir vor, du organisierst eine Party (wer liebt nicht eine gute Codierungsparty, oder?). Du brauchst einen Ort, um alle wichtigen Informationen zu speichern - wie viele Pizzen bestellt werden sollen, wer kommt und welche Spiele gespielt werden sollen. In JavaScript sind Variablen wie diese Speicherbehälter für deine Partyplanung. Sie halten die Daten, die wir brauchen, damit unsere Programme funktionieren.

Lassen wir mit einem einfachen Beispiel beginnen:

let partyGuests = 10;

Hier haben wir eine Variable namens partyGuests erstellt und ihr den Wert 10 zugewiesen. Es ist, als hättest du auf einem Klebezettel geschrieben: "Wir erwarten 10 Gäste."

Variablendeklaration in JavaScript

Nun, lassen Sie uns darüber sprechen, wie wir diese Variablen tatsächlich erstellen. In JavaScript haben wir drei Möglichkeiten, Variablen zu deklarieren:

  1. var - Die alte Schule (funktioniert immer noch, aber hat einige Eigenarten)
  2. let - Der coole neue Junge im Block (verwenden Sie dies für Variablen, die sich ändern könnten)
  3. const - Der unerschütterliche Beschützer (verwenden Sie dies für Variablen, die nicht ändern)

Sehen wir sie in Aktion:

var oldSchoolCool = "Ich bin eine var-Variable";
let modernAndFlexible = "Ich bin eine let-Variable";
const rockSolid = "Ich bin eine const-Variable";

Denke daran, var als die Vinyl-Schallplatten deines Großvaters, let als deine beschreibbare CD und const als deinen Lieblingssong zu betrachten, den du niemals ändern möchtest.

Variableninitialisierung mit dem Zuweisungsoperator

Erinnern Sie sich an das =-Zeichen aus dem Mathematikunterricht? In JavaScript wird es der Zuweisungsoperator genannt. Es ist wie eine magischestab, der Werte in unsere Variablen einfügt:

let magicNumber;  // Deklaration
magicNumber = 42; // Initialisierung

// Oder wir können beides auf einmal tun:
let theAnswerToEverything = 42;

Pro-Tipp: Initialisieren Sie immer Ihre Variablen. Es ist wie sicherzustellen, dass Sie vor dem Einladen von Freunden Essen im Kühlschrank haben!

JavaScript-Datentypen

JavaScript ist ziemlich flexibel, wenn es darum geht, welche Art von Daten wir in Variablen speichern können. Hier sind die Haupttypen:

Datentyp Beispiel Beschreibung
Number let age = 25; Für numerische Werte
String let name = "Alice"; Für Text
Boolean let isAwesome = true; Für true/false-Werte
Undefined let mystery; Für Variablen ohne Wert
Null let emptyBox = null; Für absichtlich leere Variablen
Object let person = {name: "Bob", age: 30}; Für komplexe Datenstrukturen
Array let fruits = ["apple", "banana", "cherry"]; Für Listen von Elementen

Sehen wir sie in Aktion:

let myAge = 30;
let myName = "JavaScript Ninja";
let canCode = true;
let futureSkill;
let emptyMind = null;
let myProfile = {job: "Coder", hobby: "Kaffeetrinken"};
let myTodoList = ["JavaScript lernen", "tolle Dinge bauen", "die Welt verändern"];

console.log(typeof myAge);  // Ausgabe: number
console.log(typeof myName);  // Ausgabe: string
console.log(typeof canCode);  // Ausgabe: boolean
console.log(typeof futureSkill);  // Ausgabe: undefined
console.log(typeof emptyMind);  // Ausgabe: object (dies ist ein Kuriosum in JavaScript!)
console.log(typeof myProfile);  // Ausgabe: object
console.log(typeof myTodoList);  // Ausgabe: object (Arrays sind besondere Objekte in JS)

JavaScript-Variablennamen (Bezeichner)

Variablen zu benennen ist wie das Benennen deiner Haustiere - es gibt Regeln, aber du kannst immer noch kreativ sein! Hier sind die wichtigsten Regeln:

  1. Beginne mit einem Buchstaben, einem Unterstrich (_) oder einem Dollarzeichen ($)
  2. Kann Buchstaben, Zahlen, Unterstriche oder Dollarzeichen enthalten
  3. Sind case-sensitive (myVar ≠ myvar)
  4. Können keine reservierten Keywords verwenden (wie let, const, function, etc.)

Gute Beispiele:

let camelCase = "Ich bin nach einem hügeligen Tier benannt";
let _underscoreFirst = "Ich beginne mit einem Unterstrich";
let $dollarSign = "Ich fühle mich reich";
let mix123 = "Ich bin eine Mischung aus Buchstaben und Zahlen";

Nicht-so-gute Beispiele:

let 123abc = "Ich beginne mit einer Zahl, daher bin ich ungültig";
let my-variable = "Bindestriche sind in Variablennamen nicht erlaubt";
let let = "Ich bin ein reserviertes Keyword, daher bin ich tabu";

JavaScript Dollar-Zeichen ($) und Unterstrich (_)

Das Dollarzeichen ($) und der Unterstrich (_) sind besondere Zeichen in JavaScript. Sie werden oft in Bibliotheksnamen oder für besondere Zwecke verwendet:

let $_$ = "Ich bin ein gültiger Variablenname, aber ich sehe komisch aus";
let _privateVariable = "Ich werde oft verwendet, um eine private Variable zu kennzeichnen";
let $jQueryObject = "Ich werde oft in jQuery verwendet, um ein jQuery-Objekt darzustellen";

Ungültiger Variablenwert in JavaScript

Wenn du eine Variable deklarierst, ohne sie zu initialisieren, bekommt sie einen besonderen Wert namens undefined:

let myFuturecar;
console.log(myFuturecar);  // Ausgabe: undefined

// Dies ist unterschiedlich von null:
let myEmptyGarage = null;
console.log(myEmptyGarage);  // Ausgabe: null

Denke daran, undefined als "Ich habe hier vergessen, einen Wert einzufügen" und null als "Ich habe dies absichtlich leer gelassen."

JavaScript-Variablenbereich

Der Bereich einer Variablen in JavaScript ist wie die Sichtbarkeit eines Ninja. Einige Variablen können überall gesehen werden (globaler Bereich), während andere nur in bestimmten Bereichen sichtbar sind (lokaler Bereich).

let globalNinja = "Ich bin überall sichtbar!";

function stealthMission() {
let localNinja = "Ich bin nur in dieser Funktion sichtbar";
console.log(globalNinja);  // Das funktioniert
console.log(localNinja);   // Das funktioniert auch
}

console.log(globalNinja);  // Das funktioniert
console.log(localNinja);   // Das wirft einen Fehler - localNinja ist hier nicht definiert

Denke daran, was in Vegas... ich meine, in einer Funktion passiert, bleibt in der Funktion (es sei denn, du gibst es explizit zurück).

Und das ist es, mein Codierungslehrling! Du hast gerade deine JavaScript-Fähigkeiten gesteigert. Erinnere dich daran, Übung macht den Meister, also weiter coden und experimentieren. Bevor du es weißt, wirst du Variablen wie eine professionelle Zirkusartistin jonglieren können! ??‍♀️

Frohes Coden und möge die Variablen immer zu deinem Gunsten sein! ?✨

Credits: Image by storyset