JavaScript-Datentypen

Inhaltsverzeichnis

JavaScript hat 8 Datentypen

1. Zeichenfolge
2. Nummer
3. Bigint
4. Boolescher Wert
5. Undefiniert
6. Null
7. Symbol
8. Objekt

Der Objektdatentyp

Der Objektdatentyp kann Folgendes enthalten:

1. Ein Objekt
2. Ein Array
3. Ein Datum

Beispiele

// Numbers:
let length = 16;
let weight = 7.5;

// Strings:
let color = "Yellow";
let lastName = "Johnson";

// Booleans
let x = true;
let y = false;

// Object:
const person = {firstName:"John", lastName:"Doe"};

// Array object:
const cars = ["Saab", "Volvo", "BMW"];

// Date object:
const date = new Date("2022-03-25");

Notiz

Eine JavaScript-Variable kann jede Art von Daten enthalten.

Das Konzept der Datentypen

In der Programmierung sind Datentypen ein wichtiges Konzept.

Um mit Variablen arbeiten zu können, ist es wichtig, etwas darüber zu wissen der Typ.

Ohne Datentypen kann ein Computer dies nicht sicher lösen:

let x = 16 + "Volvo";

Macht es Sinn, „Volvo“ zu sechzehn hinzuzufügen? Wird es eine produzieren? Fehler oder führt es zu einem Ergebnis?

JavaScript behandelt das obige Beispiel wie folgt:

let x = "16" + "Volvo";

Notiz

Beim Hinzufügen einer Zahl und einer Zeichenfolge behandelt JavaScript die Zahl als Zeichenfolge.

Beispiel

let x = 16 + "Volvo";

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>When adding a number and a string, JavaScript will treat the number as a string.</p>

<p id="demo"></p>

<script>
let x = 16 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Beispiel

let x = "Volvo" + 16;

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>When adding a string and a number, JavaScript will treat the number as a string.</p>

<p id="demo"></p>

<script>
let x = "Volvo" + 16;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript wertet Ausdrücke von links nach rechts aus. Verschiedene Sequenzen können unterschiedliche Ergebnisse liefern:

JavaScript:

let x = 16 + 4 + "Volvo";

Ergebnis :

20Volvo

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>

<p id="demo"></p>

<script>
let x = 16 + 4 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

JavaScript:

let x = "Volvo" + 16 + 4;

Ergebnis :

Volvo164

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>

<p id="demo"></p>

<script>
let x = "Volvo" + 16 + 4;
document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Im ersten Beispiel behandelt JavaScript 16 und 4 als Zahlen, bis es „Volvo“ erreicht.

Da im zweiten Beispiel der erste Operand eine Zeichenfolge ist, sind es auch alle Operanden als Strings behandelt.

JavaScript-Typen sind dynamisch

JavaScript verfügt über dynamische Typen. Dies bedeutet, dass dieselbe Variable verwendet werden kann halten verschiedene Datentypen:

Beispiel

let x;       // Now x is undefined
x = 5;       // Now x is a Number
x = "John";  // Now x is a String

JavaScript-Strings

Eine Zeichenfolge (oder eine Textzeichenfolge) ist eine Reihe von Zeichen wie „John Doe“.

Zeichenfolgen werden mit Anführungszeichen geschrieben. Sie können einfache oder doppelte Anführungszeichen verwenden:

Beispiel

// Using double quotes:
let carName1 = "Volvo XC60";

// Using single quotes:
let carName2 = 'Volvo XC60';

Sie können Anführungszeichen innerhalb einer Zeichenfolge verwenden, solange diese nicht mit den Anführungszeichen übereinstimmen umgibt die Zeichenfolge:

Beispiel

// Single quote inside double quotes:
let answer1 = "It's alright";
 

// Single quotes inside double quotes:
let answer2 = "He is called 'Johnny'";

// Double quotes inside single quotes:
let answer3 = 'He is called "Johnny"';

Später in diesem Tutorial erfahren Sie mehr über Strings.

JavaScript-Nummern

Alle JavaScript-Zahlen werden als Dezimalzahlen (Gleitkomma) gespeichert.

Zahlen können mit oder ohne Dezimalstellen geschrieben werden:

Beispiel

// With decimals:
let x1 = 34.00;

 
// Without decimals:
let x2 = 34;

Exponentielle Notation

Extra große oder extra kleine Zahlen können mit wissenschaftlicher Schreibweise geschrieben werden (exponentielle) Notation:

Beispiel

let y = 123e5;    // 12300000
let z = 123e-5;   // 0.00123

Notiz

Die meisten Programmiersprachen haben viele Zahlentypen:

Ganze Zahlen (Ganzzahlen):
Byte (8-Bit), kurz (16-Bit), int (32-Bit), lang (64-Bit)

Reelle Zahlen (Gleitkommazahl):
Float (32-Bit), Double (64-Bit).

Javascript-Nummern sind immer ein Typ:
double (64-Bit-Gleitkomma).

Später in diesem Tutorial erfahren Sie mehr über Zahlen.

JavaScript BigInt

Alle JavaScript-Zahlen werden in einem 64-Bit-Gleitkommaformat gespeichert.

JavaScript BigInt ist ein neuer Datentyp (ES2020), der zum Speichern von Ganzzahlwerten verwendet werden kann, die zu groß für die Darstellung sind durch eine normale JavaScript-Nummer.

Beispiel

let x = BigInt("123456789012345678901234567890");

Später in diesem Tutorial erfahren Sie mehr über BigInt.

JavaScript-Boolesche Werte

Boolesche Werte können nur zwei Werte haben: true oder false.

Beispiel

let x = 5;
let y = 5;
let z = 6;
(x == y)       
  // Returns true
(x == z)       // Returns 
  false

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Booleans</h2>

<p>Booleans can have two values: true or false:</p>

<p id="demo"></p>

<script>
let x = 5;
let y = 5;
let z = 6;

document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>

</body>
</html>

Bei bedingten Tests werden häufig boolesche Werte verwendet.

Später in diesem Tutorial erfahren Sie mehr über boolesche Werte.

JavaScript-Arrays

JavaScript-Arrays werden mit eckigen Klammern geschrieben.

Array-Elemente werden durch Kommas getrennt.

Der folgende Code deklariert (erstellt) ein Array namens cars, das drei enthält Artikel (Autonamen):

Beispiel

const cars = ["Saab", "Volvo", "BMW"];

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Arrays</h2>

<p>Array indexes are zero-based, which means the first item is [0].</p>

<p id="demo"></p>

<script>
const cars = ["Saab","Volvo","BMW"];

document.getElementById("demo").innerHTML = cars[0];
</script>

</body>
</html>

Array-Indizes sind nullbasiert, was bedeutet, dass das erste Element [0] ist, das zweite [1] und so weiter.

Später in diesem Tutorial erfahren Sie mehr über Arrays.

JavaScript-Objekte

JavaScript-Objekte werden mit geschweiften Klammern {} geschrieben.

Objekt Eigenschaften werden als durch Kommas getrennte Name:Wert-Paare geschrieben.

Beispiel

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Objects</h2>

<p id="demo"></p>

<script>
const person = {
  firstName : "John",
  lastName  : "Doe",
  age     : 50,
  eyeColor  : "blue"
};

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Das Objekt (Person) im obigen Beispiel hat 4 Eigenschaften: Vorname, Nachname, Alter und Augenfarbe.

Später in diesem Tutorial erfahren Sie mehr über Objekte.

Der Typ des Operators

Sie können den JavaScript-Operator typeof verwenden, um den Typ zu finden einer JavaScript-Variablen.

Der Operator typeof gibt den Typ einer Variablen oder eines Ausdrucks zurück:

Beispiel

typeof ""             // Returns 
 "string"
typeof "John"         // Returns 
 "string"
typeof "John Doe"     // Returns 
 "string"

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof "" + "<br>" +
typeof "John" + "<br>" + 
typeof "John Doe";
</script>
</body>
</html>

Beispiel

typeof 0              // Returns 
 "number"
  typeof 314            // Returns 
 "number"
  typeof 3.14           // Returns 
 "number"
  typeof (3)            // Returns 
 "number"
typeof (3 + 4)        // Returns 
 "number"

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof 0 + "<br>" + 
typeof 314 + "<br>" +
typeof 3.14 + "<br>" +
typeof (3) + "<br>" +
typeof (3 + 4);
</script>

</body>
</html>

Später in diesem Tutorial erfahren Sie mehr über typeof.

Nicht definiert

In JavaScript hat eine Variable ohne Wert den Wert undefiniert. Der Typ ist auch undefiniert.

Beispiel

let car;    // Value is undefined, 
    type is undefined

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>

<p id="demo"></p>

<script>
let car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>

</body>
</html>

Jede Variable kann geleert werden, indem der Wert auf undefiniert gesetzt wird. Der Typ ist außerdem undefiniert.

Beispiel

   car = undefined;    // Value is undefined, 
    type is undefined

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>Variables can be emptied if you set the value to <b>undefined</b>.</p>

<p id="demo"></p>

<script>
let car = "Volvo";
car = undefined;

document.getElementById("demo").innerHTML = car + "<br>" + typeof car;
</script>

</body>
</html>

Leere Werte

Ein leerer Wert hat nichts mit undefiniert zu tun.

Eine leere Zeichenfolge hat sowohl einen zulässigen Wert als auch einen Typ.

Beispiel

let car = "";    // The value is  "", the typeof is "string"

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>An empty string has both a legal value and a type:</p>

<p id="demo"></p>

<script>
let car = "";
document.getElementById("demo").innerHTML =
"The value is: " +
car + "<br>" +
"The type is: " + typeof car;
</script>

</body>
</html>