Как получить тип переменной в Typescript?


114

У меня есть переменная.

abc:number|string;

Как я могу проверить его тип? Я хочу сделать что-то вроде ниже:

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

Ответы:


176

Для :

abc:number|string;

Используйте оператор JavaScripttypeof :

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

TypeScript понимает typeof 🌹

Это называется typeguard.

Больше

Для классов вы могли бы использовать, instanceofнапример,

class Foo {}
class Bar {} 

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

Есть и другие охранники типа , например , и inт.д. https://basarat.gitbooks.io/typescript/content/docs/types/typeGuard.html


6
Добавлено примечание, instanceofхотя это был не тот вопрос.
— Basarat 05

43

Я хотел бы добавить, что TypeGuards работает только со строками или числами, если вы хотите сравнить объект, используйте instanceof

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

5
Правда. Стоит отметить, что вы можете сделать это с помощью classes, но не с помощью TypeScript interfaceили types, потому что они не существуют в экспортированном файле JavaScript.
— joeytwiddle 09

11

Я проверил переменную, является ли она логической или нет, как показано ниже

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

Аналогично у нас есть

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

и так далее.


1
работал у меня, но только для того, чтобы знать типы !!, пользовательские типы должны использоватьinstanceof
— Carlos.V

3
utilДля доступа к этим функциям вам потребуется выполнить импорт (например,import { isString } from 'util';
— 2Toad,

1
Теперь изощренно, вместо этого используйте if (typeof value === 'string')
— Монир Хан

7

Другие ответы верны, но когда вы имеете дело с интерфейсами вы не можете использовать typeof или instanceof, потому что интерфейсы не компилируются в javascript.

Вместо этого вы можете использовать typeguard + function check typeguard для проверки вашей переменной:

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

И это скомпилированный JavaScript в ES2017:

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

Это очень важное различие между интерфейсами и классами! Я бы хотел, чтобы это было более идиоматично, но это предложение работает хорошо.
— Гусс

0

Наберите охранников в машинописном тексте

Чтобы определить тип переменной после условного оператора, вы можете использовать защиту типа. Типовой охранник в машинописном тексте следующий:

Выражение, которое позволяет сузить тип чего-либо в условном блоке.

Другими словами, это выражение внутри условного блока, откуда компилятор машинописного текста имеет достаточно информации, чтобы сузить тип. Тип будет более конкретным в блоке защиты типа, потому что компилятор вывел больше информации о типе.

пример

declare let abc: number | string;

// typeof abc === 'string' is a type guard
if (typeof abc === 'string') {
    // abc: string
    console.log('abc is a string here')
} else {
    // abc: number, only option because the previous type guard removed the option of string
    console.log('abc is a number here')
}

Помимо typeofоператора есть встроенные охранники типа instanceof, inи даже ограждения собственного типа.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.