¿Cómo obtener un tipo de variable en TypeScript?


110

Tengo una variable.

abc:number|string;

¿Cómo puedo comprobar su tipo? Quiero hacer algo como a continuación:

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

Respuestas:


170

Por :

abc:number|string;

Utilice el operador de JavaScripttypeof :

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

TypeScript entiende typeof🌹

Esto se llama typeguard.

Más

Para las clases, usaría, instanceofpor ejemplo,

class Foo {}
class Bar {} 

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

También hay otros tipos de guardias, por ejemplo, inetc. https://basarat.gitbooks.io/typescript/content/docs/types/typeGuard.html


6
Se agregó una nota sobre instanceofaunque esa no era la pregunta formulada
— basarat

42

Me gustaría agregar que TypeGuards solo funciona con cadenas o números, si desea comparar un objeto use instanceof

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

5
Cierto. Vale la pena señalar que puede hacer esto con classes pero no con TypeScript interfaces o types, porque no existen en el archivo JavaScript exportado.
— joeytwiddle

10

He verificado una variable si es booleana o no como se muestra a continuación

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

Similarmente tenemos

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

y así.


1
funcionó para mí, pero solo para conocer los tipos !!, los tipos personalizados tienen que usarinstanceof
— Carlos.V

3
Deberá importar utilpara acceder a estas funciones (por ejemplo,import { isString } from 'util';
— 2Toad

Depricado ahora, use if (typeof value === 'string') en su lugar
— Monir Khan

7

Las otras respuestas son correctas, pero cuando se trata de interfaces, no puede usar typeof o instanceof porque las interfaces no se compilan en javascript.

En su lugar, puede usar una función typecast + check typeguard para verificar su variable:

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();
    }
}

Y este es el JavaScript compilado en ES2017:

function start(vehicle) {
    vehicle.drive();
    if (vehicle.ringTheBell) {
        const bike = vehicle;
        bike.ringTheBell();
    }
    else {
        const car = vehicle;
        car.honkTheHorn();
    }
}

¡Esta es una distinción muy importante entre interfaces y clases! Desearía que hubiera una forma más idiomática de hacer esto, pero esta sugerencia funciona bien.
— Guss
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.