Wie bekomme ich einen Variablentyp in Typescript?


110

Ich habe eine Variable.

abc:number|string;

Wie kann ich den Typ überprüfen? Ich möchte etwas wie das Folgende tun:

if (abc.type === "number") {
    // do something
}

Antworten:


167

Zum :

abc:number|string;

Verwenden Sie den JavaScript- Operator typeof:

if (typeof abc === "number") {
    // do something
}

TypeScript versteht typeof🌹

Dies wird als Typeguard bezeichnet.

Mehr

Für Klassen würden Sie instanceofzB verwenden

class Foo {}
class Bar {} 

// Later
if (fooOrBar instanceof Foo){
  // TypeScript now knows that `fooOrBar` is `Foo`
}

Es gibt auch eine andere Art Wächter zB inetc https://basarat.gitbooks.io/typescript/content/docs/types/typeGuard.html


6
Hinweis hinzugefügt, instanceofobwohl dies nicht die gestellte Frage war.
— Basarat

42

Ich möchte hinzufügen, dass TypeGuards nur mit Zeichenfolgen oder Zahlen funktioniert, wenn Sie eine Objektverwendungsinstanz von vergleichen möchten

if(task.id instanceof UUID) {
  //foo
}

5
Wahr. Beachten Sie, dass Sie dies mit classes tun können, jedoch nicht mit TypeScript interfaces oder types, da diese in der exportierten JavaScript-Datei nicht vorhanden sind.
— Joeytwiddle

10

Ich habe eine Variable überprüft, ob sie boolesch ist oder nicht (siehe unten)

console.log(isBoolean(this.myVariable));

Ebenso haben wir

isNumber(this.myVariable);
isString(this.myvariable);

und so weiter.


1
arbeitete für mich, aber nur um Typen zu kennen !!, müssen benutzerdefinierte Typen verwendet werdeninstanceof
— Carlos.V

3
Sie müssen importieren, utilum auf diese Funktionen zugreifen zu können (z. B.import { isString } from 'util';
— 2Toad

Verwenden Sie stattdessen if (typeof value === 'string')
— Monir Khan

6

Die anderen Antworten sind richtig, aber wenn Sie mit Schnittstellen arbeiten , können Sie typeof oder instanceof nicht verwenden, da Schnittstellen nicht zu Javascript kompiliert werden.

Stattdessen können Sie einen typecast + function check typeguard verwenden, um Ihre Variable zu überprüfen:

interface Car {
    drive(): void;
    honkTheHorn(): void;
}

interface Bike {
    drive(): void;
    ringTheBell(): void;
}

function start(vehicle: Bike | Car ) {
    vehicle.drive();

    // typecast and check if the function exists
    if ((<Bike>vehicle).ringTheBell) {
        const bike = (<Bike>vehicle);
        bike.ringTheBell();
    } else {
        const car = (<Car>vehicle);
        car.honkTheHorn();
    }
}

Und dies ist das kompilierte JavaScript in ES2017:

function start(vehicle) {
    vehicle.drive();
    if (vehicle.ringTheBell) {
        const bike = vehicle;
        bike.ringTheBell();
    }
    else {
        const car = vehicle;
        car.honkTheHorn();
    }
}
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.