Menu
CoddyTech

Tipos de Interseção ('&')

Parte da seção Introdução ao TypeScript do Journey de JavaScript da Coddy. Lição 34 de 73.

Embora os tipos de união permitam criar variáveis que podem ser de um entre vários tipos, os tipos de interseção funcionam na direção oposta. Eles combinam vários tipos em um único tipo que possui todas as propriedades dos tipos combinados.

Os tipos de interseção usam o operador de e comercial (&) para mesclar tipos. Quando você faz a interseção de dois tipos de objeto, o resultado contém todas as propriedades de ambos os tipos:

type HasName = { name: string };
type HasAge = { age: number };

type Person = HasName & HasAge;

// Person agora tem ambas as propriedades name E age
let user: Person = {
  name: "Alice",
  age: 30
};

Isso é particularmente útil quando você quer criar tipos complexos a partir de partes menores e reutilizáveis. Em vez de definir um único tipo de objeto grande, você pode criar tipos específicos para determinadas responsabilidades e combiná-los conforme necessário.

Os tipos de interseção garantem que o tipo resultante satisfaça todos os requisitos dos tipos intersectados. A variável deve ter todas as propriedades de cada tipo na interseção — não é possível escolher propriedades, como acontece com as uniões.

challenge icon

Desafio

Fácil

Crie dois aliases de tipo: HasName para um objeto com uma propriedade name do tipo string e HasAge para um objeto com uma propriedade age do tipo number.

Crie um terceiro alias de tipo chamado Person fazendo a interseção de HasName e HasAge usando o operador &.

Crie outro alias de tipo chamado HasEmail para um objeto com uma propriedade email do tipo string.

Crie um quarto alias de tipo chamado Employee fazendo a interseção dos três tipos: HasName, HasAge e HasEmail.

Agora crie as seguintes variáveis:

  • Crie uma variável chamada user do tipo Person com o nome "Alice" e a idade 25
  • Crie uma variável chamada worker do tipo Employee com o nome "Bob", a idade 30 e o e-mail "bob@company.com"

Crie uma função chamada displayPerson que aceite um parâmetro do tipo Person e retorne uma string no formato "Name: [name], Age: [age]".

Crie outra função chamada displayEmployee que aceite um parâmetro do tipo Employee e retorne uma string no formato "Name: [name], Age: [age], Email: [email]".

Chame ambas as funções com as variáveis apropriadas e imprima os resultados em linhas separadas.

Experimente você mesmo

// TODO: Escreva seu código aqui
// Crie aliases de tipo para HasName, HasAge, HasEmail
// Crie os tipos Person e Employee usando interseção
// Crie as variáveis user e worker
// Crie as funções displayPerson e displayEmployee
// Chame as funções e imprima os resultados
quiz iconTeste seus conhecimentos

Esta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.

Todas as lições de Introdução ao TypeScript

Pratique por conta própria: Playground de TypeScript