Einführung
Zu wissen, welchen Typ ein Datenelement hat, ist oft sehr wichtig, damit Code reibungslos und ohne Fehler läuft.
JavaScript bietet mehrere Möglichkeiten, den Typ eines Werts oder Objekts zu prüfen.
Die Mechanismen von JavaScript zur Typprüfung können etwas unzuverlässig sein.
Für bessere Typsicherheit und stärkere Typen solltest du wahrscheinlich TypeScript verwenden, eine Sprache, die auf JavaScript aufbaut, aber die Typsyntax einer statisch typisierten Sprache mitbringt.
Der Operator typeof
Der Operator typeof gibt den Typ seines Operanden zurück.
Die Ausgabe ist ein String, der dem Namen eines der primitiven Datentypen entspricht, außer bei "null".
Er kann auch "function" oder "object" sein.
typeof undefined;
// => "undefined"
typeof true;
// => "boolean"
typeof 42;
// => "number"
typeof 'Hello, World!';
// => "string"
typeof function () {
return 'Hello, World';
};
// => "function"
typeof [1, 2, 3, 4];
// => "object"
typeof { city: 'Stockholm', country: 'Sweden' };
// => "object"
Aus [historischen Gründen][typeof null is "object"].
Der Operator instanceof
Um den Typ eines Objekts zu prüfen, kannst du den Operator instanceof verwenden.
Er ergibt einen boolean-Wert, je nachdem, ob der zweite Operand in der Prototypkette des ersten Operanden enthalten ist.
Zur Klarstellung: instanceof gibt zurück, ob der erste Operand eine Instanz des zweiten Operanden oder einer seiner Unterklassen ist.
instanceof funktioniert nur mit Objekten.
class Beverage {
// ...
}
// The Coffee class is a child of the Beverage class.
class Coffee extends Beverage {
// ...
}
const java = new Coffee();
java instanceof Coffee;
// => true
java instanceof Beverage;
// => true
Die Klasse Array hat eine Methode namens Array.isArray(), die prüft, ob ihr Argument ein Array ist.
Während instanceof Array bei einem Array nicht funktioniert, das in einem anderen Realm erstellt wurde, etwa einem iframe in einer Webseite, funktioniert Array.isArray().
Das liegt daran, dass die Klasse Array in jedem Realm einen anderen Konstruktor hat und jeder iframe seinen eigenen Realm besitzt. Die Funktion in der Prototypkette ist also eine andere, wodurch instanceof Array fehlschlägt.
Array.isArray() kann das ignorieren und sollte nach Möglichkeit immer verwendet werden.
Außerdem vermeidet es falsch-positive Ergebnisse, bei denen ein Objekt gar kein Array ist und Array nur in seiner Prototypkette hat.
({ __proto__: Array.prototype }) instanceof Array
// => true
Array.isArray({ __proto__: Array.prototype })
// => false
Der Operator in
Der Operator in gibt zurück, ob der erste Operand eine Eigenschaft des zweiten Operanden ist.
Er prüft nicht, ob die Eigenschaft einen definierten Wert hat.
Eine Eigenschaft, die auf undefined gesetzt ist, wird von in trotzdem erkannt.
class Coffee {
constructor() {
this.temperature = 'hot';
this.isDarkMatter = undefined;
}
coolDown() {
this.temperature = 'warm';
}
}
const espresso = new Coffee();
'temperature' in espresso;
// => true
'color' in espresso;
// => false
'isDarkMatter' in espresso;
// => true
in gibt bei geerbten Eigenschaften und Methoden true zurück.
"coolDown" in espresso
// => true
"constructor" in espresso
// => true
Um das zu vermeiden, verwende stattdessen Object.hasOwn()
Die Funktion Object.hasOwn()
Die Methode Object.hasOwn() gibt zurück, ob das angegebene Objekt die angegebene Eigenschaft selbst besitzt (sie also nicht geerbt wurde und keine Methode ist).
class Coffee {
constructor() {
this.temperature = 'hot';
}
coolDown() {
this.temperature = 'warm';
}
}
const cappuccino = new Coffee();
Object.hasOwn(cappucino, 'temperature');
// => true
Object.hasOwn(cappucino, 'constructor');
// => false
Object.hasOwn(cappucino, 'coolDown');
// => false
Anleitung
Anweisungen
Du wurdest von einem Recyclingzentrum eingestellt.
Aus Platzmangel landen alle Produkte auf demselben Förderband, aber dadurch vermischen sich die verschiedenen Materialien und werden unbrauchbar.
Um das zu beheben, sollst du Funktionen schreiben, die den Typ eines Produkts erkennen.
1. Prüfe, ob ein Wert ein boolescher Wert ist
Implementiere die isBoolean-Funktion, die prüft, ob ein Wert ein boolescher Wert ist.
isBoolean(true);
// => true
isBoolean(null);
// => false
2. Prüfe, ob ein Wert eine Zahl ist.
Implementiere die isNumber-Funktion, die prüft, ob ein Wert eine endliche number oder bigint ist, also nicht NaN oder Infinity.
Manchmal versagt das Gerät zum Lesen von IDs und liest einen nicht-numerischen Wert als NaN (Not a Number) oder Infinity ein.
Deine Funktion sollte auch das korrekt behandeln können.
isNumber(42);
// => true
isNumber('Hello, World!');
// => false
isNumber(42n);
// => true
isNumber(NaN);
// => false
3. Prüfe, ob ein Wert ein Objekt ist
Implementiere die isObject-Funktion, die prüfen soll, ob der Wert ein Objekt ist.
Auf dem Förderband ist null nichts und wird nicht als Objekt betrachtet.
isObject({ greeting: 'Hello' });
// => true
isObject(25n);
// => false
4. Prüfe, ob ein String numerisch ist
Implementiere die isNumericString-Funktion, die prüfen soll, ob der Wert ein String ist, der nur aus Ziffern besteht oder aus einem Minuszeichen gefolgt von Ziffern, was eine negative Zahl angibt.
Es sollen nur Ganzzahlen berücksichtigt werden, Gleitkommazahlen gelten für diese Prüfung des Recyclingroboters nicht als numerisch.
isNumericString(42);
// => false
isNumericString('42');
// => true
isNumericString('Hi!');
// => false
5. Prüfe, ob ein Objekt elektronisch ist
Implementiere die isElectronic-Funktion, die prüft, ob ein Objekt eine Instanz der vorgegebenen Klasse ElectronicDevice oder einer ihrer Unterklassen ist.
class Duck {
//...
}
class WashingMachine extends ElectronicDevice {
//...
}
isElectronic(new Duck());
// => false
isElectronic(new WashingMachine());
// => true
6. Prüfe, ob ein Wert ein nicht leeres Array ist
Implementiere die isNonEmptyArray-Funktion, die prüft, ob ein Wert ein nicht leeres Array ist.
isNonEmptyArray([1, 2, 3]);
// => true
isNonEmptyArray([]);
// => false
7. Prüfe, ob ein Wert ein leeres Array ist
Implementiere die isEmptyArray-Funktion, die prüft, ob ein Wert ein leeres Array ist.
isEmptyArray([1, 2, 3]);
// => false
isEmptyArray([]);
// => true
8. Prüfe, ob ein Objekt eine type-Eigenschaft oder -Methode hat
Implementiere die hasType-Funktion, die prüft, ob ein Objekt eine type-Eigenschaft oder -Methode hat.
class Keyboard(){
type(){
// ...
}
}
hasType({ type:"car", color:"red" })
// => true
hasType({ color:"green" })
// => false
hasType(new Keyboard())
// => true
9. Löse einen Fehler aus, wenn ein Objekt keine id-Eigenschaft oder -Methode hat
Implementiere die assertHasId-Funktion, die einen Error auslöst, wenn bei einem Objekt die id-Eigenschaft fehlt.
Wenn ein Objekt die id-Eigenschaft hat, soll sie nichts zurückgeben.
assertHasId({ id: 42, color: 'red' });
// => undefined
assertHasId({ color: 'green' });
// Error: "Object is missing the 'id' property"
10. Prüfe, ob ein Objekt eine id-Eigenschaft hat
Implementiere die hasIdProperty-Funktion, die prüft, ob ein Objekt eine id-Eigenschaft hat.
class SimpleData {
constructor() {
this.number = '42';
this.id = 'BC269327FE1D9B95';
}
}
class StealingData extends SimpleData {}
class MethodData {
constructor() {
this.number = '42';
this._id = 'BC269327FE1D9B95';
}
get id() {
return this._id;
}
}
hasIdProperty(new SimpleData());
// => true
hasIdProperty(new MethodData());
// => false
hasIdProperty(new StealingData());
// => false
11. Prüfe, ob ein Objekt eine definierte type-Eigenschaft hat
Implementiere die hasDefinedType-Funktion, die prüft, ob ein Objekt eine type-Eigenschaft hat, die nicht undefined ist.
hasDefinedType({ type: undefined, color: 'red' });
// => false
hasDefinedType({ type: 'car', color: 'green' });
// => true
Lernübung
