TypeScript Academy · Aula

Proteções de tipos

Trabalhe com segurança com tipos unknown ou any usando proteções de tipos

Proteções de tipos é uma aula grátis de TypeScript Academy no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de TypeScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de TypeScript Academy inclui 4 aulas no total.

Introdução aos protetores de tipo

Protetores de tipo

Boas-vindas à próxima lição! Nesta lição, você aprenderá sobre protetores de tipo, um recurso poderoso do TypeScript que permite restringir tipos durante a execução. Os protetores de tipo garantem a segurança de tipos do seu código e evitam erros. Vamos começar!

O que são protetores de tipo?

Um protetor de tipo é uma função ou construção que determina o tipo de uma variável durante a execução. Ele permite que o TypeScript restrinja o tipo de uma variável dentro de um bloco de código específico.

Exemplo:

Tarefa: Escreva uma função que use um protetor de tipo para verificar se um valor é um número.

function isString(value: unknown): boolean {
  return typeof value === "string";
}

function printLength(value: unknown): void {
  if (isString(value)) {
    console.log(value.length); 
// TypeScript knows 'value' is a string here
  } else {
    console.log("Value is not a string");
  }
}

printLength("Hello"); 
// Output: 5
printLength(42); 
// Output: Value is not a string

Usando <code>typeof</code> com tipos primitivos

Usando `typeof` com tipos primitivos

Você pode usar o operador typeof para verificar o tipo de valores primitivos, como cadeias de caracteres, números e valores booleanos.

Exemplo:

Tarefa: Use typeof para diferenciar uma cadeia de caracteres de um número em uma função.

function printValue(value: string | number): void {
  if (typeof value === "string") {
    console.log(`String value: ${value}`);
  } else {
    console.log(`Number value: ${value}`);
  }
}

printValue("Hello"); 
// Output: String value: Hello
printValue(42); 
// Output: Number value: 42

Usando <code>instanceof</code> com classes

Usando `instanceof` com classes

O operador instanceof verifica se um objeto é uma instância de uma classe específica. Exemplo:

Tarefa: Use instanceof para lidar com diferentes instâncias de classes em uma função.

class Dog {
  bark(): void {
    console.log("Woof!");
  }
}

class Cat {
  meow(): void {
    console.log("Meow!");
  }
}

function makeSound(animal: Dog | Cat): void {
  if (animal instanceof Dog) {
    animal.bark();
  } else {
    animal.meow();
  }
}

let dog = new Dog();
let cat = new Cat();
makeSound(dog); 
// Output: Woof!
makeSound(cat); 
// Output: Meow!

Usando protetores de tipo personalizados

Você pode criar funções de protetor de tipo personalizadas usando um tipo de retorno value is Type. Exemplo:

interface Car {
  make: string;
  model: string;
}

interface Bike {
  brand: string;
  type: string;
}

function isCar(vehicle: Car | Bike): vehicle is Car {
  return (vehicle as Car).make !== undefined;
}

function printVehicle(vehicle: Car | Bike): void {
  if (isCar(vehicle)) {
    console.log(`Car: ${vehicle.make} ${vehicle.model}`);
  } else {
    console.log(`Bike: ${vehicle.brand} ${vehicle.type}`);
  }
}

let car: Car = { make: "Toyota", model: "Corolla" };
let bike: Bike = { brand: "Yamaha", type: "Sport" };

printVehicle(car); 
// Output: Car: Toyota Corolla
printVehicle(bike);
 // Output: Bike: Yamaha Sport

Uniões discriminadas

As uniões discriminadas usam uma propriedade comum para diferenciar os tipos. Exemplo:

interface Circle {
  kind: "circle";
  radius: number;
}

interface Rectangle {
  kind: "rectangle";
  width: number;
  height: number;
}

type Shape = Circle | Rectangle;

function calculateArea(shape: Shape): number {
  if (shape.kind === "circle") {
    return Math.PI * shape.radius ** 2;
  } else {
    return shape.width * shape.height;
  }
}

let circle: Circle = { kind: "circle", radius: 5 };
let rectangle: Rectangle = { kind: "rectangle", width: 10, height: 20 };

console.log(calculateArea(circle)); 
// Output: 78.53981633974483
console.log(calculateArea(rectangle)); 
// Output: 200

Verificação de exaustividade

A verificação de exaustividade garante que todos os casos possíveis de uma união discriminada sejam tratados. Exemplo:

function getShapeInfo(shape: Shape): string {
  switch (shape.kind) {
    case "circle":
      return `Circle with radius ${shape.radius}`;
    case "rectangle":
      return `Rectangle with dimensions ${shape.width}x${shape.height}`;
    default:
      // This line ensures all cases are handled
      const _exhaustiveCheck: never = shape;
      return _exhaustiveCheck;
  }
}

Erros comuns

Veja alguns erros comuns ao usar protetores de tipo:

Esquecer de incluir todos os casos em um tipo de união.
Não usar um protetor de tipo em todos os ramos da lógica condicional.
Usar as incorretamente para converter tipos sem as verificações adequadas.

Dica: Sempre use protetores de tipo para restringir os tipos antes de acessar suas propriedades ou métodos específicos!

Muito bem!

Parabéns! Você aprendeu a usar protetores de tipo no TypeScript para restringir tipos durante a execução e garantir a segurança de tipos. Os protetores de tipo são essenciais para lidar com tipos de união complexos e criar código robusto e livre de erros. Na próxima lição, vamos explorar tipos mapeados avançados. Vamos continuar programando!

Perguntas Frequentes

A aula “Proteções de tipos” é grátis?

Sim — o texto completo de “Proteções de tipos” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de TypeScript Academy, atualize para CoddyKit PRO. O curso de TypeScript Academy inclui 4 aulas no total.

O que vou aprender em “Proteções de tipos”?

Trabalhe com segurança com tipos unknown ou any usando proteções de tipos Você pratica TypeScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar TypeScript Academy?

Nenhuma experiência prévia é necessária. TypeScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.

Quanto tempo leva a aula “Proteções de tipos”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de TypeScript Academy?

Sim. Cada aula de TypeScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

← Voltar para TypeScript Academy

Introdução aos protetores de tipo

Protetores de tipo

O que são protetores de tipo?

O que são protetores de tipo?

Usando <code>typeof</code> com tipos primitivos

Usando typeof com tipos primitivos

Usando <code>instanceof</code> com classes

Usando instanceof com classes

Usando protetores de tipo personalizados

Usando protetores de tipo personalizados

Uniões discriminadas

Uniões discriminadas

Verificação de exaustividade

Verificação de exaustividade

Erros comuns

Erros comuns

Muito bem!

Muito bem!

Perguntas Frequentes

A aula “Proteções de tipos” é grátis?

O que vou aprender em “Proteções de tipos”?

Preciso ter experiência prévia para começar TypeScript Academy?

Quanto tempo leva a aula “Proteções de tipos”?

Posso escrever e executar código nesta aula de TypeScript Academy?

Todas as aulas deste curso

Usando `typeof` com tipos primitivos

Usando `instanceof` com classes