Тип Охорона

Звуження типу є одним із найважливіших понять у TypeScript. Однак часто стандартних захисних засобів типу typeof або instanceof недостатньо для складних настроюваних об’єктів. Ось де на допомогу приходять Custom Type Guards.

Охоронці стандартного типу

Почнемо з узагальнення того, як TypeScript звужує типи за допомогою стандартних операторів JavaScript:

function processInput(val: string | number) {
  if (typeof val === 'string') {
    // Here 'val' is of type string
    console.log(val.toUpperCase());
  } else {
    // Here 'val' is of type number
    console.log(val.toFixed(2));
  }
}

Охоронці спеціального типу (оператор is)

Щоб визначити спеціальний захист типу, ми створюємо функцію, яка повертає предикат типу у форматі parameterName is Type замість стандартного логічного типу повернення.

Функція має повертати логічне значення (true або false). Якщо він повертає true, TypeScript знатиме, що переданий параметр має вказаний тип.

interface Cat {
  name: string;
  meow(): void;
}

interface Dog {
  name: string;
  bark(): void;
}

// This is a custom type guard
function isCat(animal: Cat | Dog): animal is Cat {
  return (animal as Cat).meow !== undefined;
}

function makeNoise(pet: Cat | Dog) {
  if (isCat(pet)) {
    // Here TypeScript knows 'pet' is a Cat
    pet.meow();
  } else {
    // Here TypeScript knows 'pet' is a Dog
    pet.bark();
  }
}

Безпека та кастинг (as проти Type Guards)

Приведення типу (наприклад, val as Cat) змушує компілятор довіряти розробнику без будь-якої реальної перевірки під час виконання. Якщо об’єкт середовища виконання не відповідає очікуванням, код виконає помилку або створить винятки.

З іншого боку, спеціальні засоби захисту типів виконують надійну та динамічну перевірку часу виконання, безпечно й точно повідомляючи компілятор TypeScript про фактичний тип змінної:

function processInput(input: unknown) {
  // unsafe casting: could crash if input does not have the split method
  // const str = input as string;
  // console.log(str.split(' '));

  // safe guard
  if (isString(input)) {
    console.log(input.split(' ')); // 100% Safe!
  }
}

Спробуйте самі

Вправа 1: Струнний тип Guard

Вправа 2: Захист преміум-користувачів

Вправа 3: Перевірка власного об’єкта помилки

Вправа 4: Admin Type Guard