Médio TypeScript

Estendendo interfaces com extends

Enunciado

Crie uma interface Funcionario que estende Pessoa (com nome e idade) adicionando cargo (string) e salario (number). Instancie um funcionário e imprima Nome: João, Cargo: Dev, Salário: 5000.

Requisitos

  • A interface Pessoa deve ter nome e idade.
  • A interface Funcionario deve estender Pessoa e adicionar cargo e salario.
  • A saída deve ser exatamente Nome: João, Cargo: Dev, Salário: 5000.

Código inicial

// Defina a interface Pessoa

// Defina a interface Funcionario com extends

// Crie o objeto e imprima

Saída esperada

Nome: João, Cargo: Dev, Salário: 5000
Ver dica

Use interface Funcionario extends Pessoa { ... } e depois crie o objeto com todas as propriedades.

Mostrar solução 
// Interface base
interface Pessoa {
  nome: string;
  idade: number;
}

// Interface que herda de Pessoa
interface Funcionario extends Pessoa {
  cargo: string;
  salario: number;
}

// Objeto que implementa Funcionario
const func: Funcionario = {
  nome: "João",
  idade: 28,
  cargo: "Dev",
  salario: 5000,
};

console.log(`Nome: ${func.nome}, Cargo: ${func.cargo}, Salário: ${func.salario}`);

Passo a passo

  1. Declaramos Pessoa com as propriedades básicas nome e idade.
  2. Criamos Funcionario usando extends Pessoa, herdando nome e idade e adicionando cargo e salario.
  3. O objeto func é tipado como Funcionario e precisa conter todas as quatro propriedades.
  4. Imprimimos apenas as propriedades desejadas usando template string.

Por que funciona

extends copia os membros da interface base para a derivada. Assim, Funcionario exige tanto os campos herdados quanto os novos. O TypeScript verifica se o objeto satisfaz todos os requisitos.

Erros comuns

  • Esquecer de incluir idade no objeto: erro de propriedade faltante.
  • Usar implements em vez de extends na interface: implements é para classes.
  • Tentar estender múltiplas interfaces com vírgula: interface A extends B, C é válido, mas se B e C tiverem membros conflitantes, dá erro.

Outra forma de resolver

Usar interseção de tipos:

type Funcionario = Pessoa & { cargo: string; salario: number };

Útil quando você quer combinar tipos sem herança nominal.

Saída esperada

Nome: João, Cargo: Dev, Salário: 5000