Tipar Objeto no TypeScript: Interface e Type
Domine a tipagem de objetos no TypeScript. Interface, type, Record, index signatures e nested objects com exemplos reais.
Por que isso é importante
Tipar Objeto no TypeScript: Interface e Type. Domine a tipagem de objetos no TypeScript. Interface, type, Record, index signatures e nested objects com exemplos reais.
O Que É Tipagem de Objeto no TypeScript
No JavaScript, objetos são sacolas mágicas. Você joga qualquer propriedade dentro, acessa campos que não existem e descobre o problema só quando o usuário reclama. No TypeScript, você define a estrutura antes e o compilador garante que tudo bate.
Tipar um objeto significa dizer quais propriedades ele tem, qual o tipo de cada uma e quais são opcionais. Dá pra fazer isso com interface, type alias, inline types e até utility types como Record e Partial.
A escolha da ferramenta depende do contexto. Objeto com forma conhecida? Interface resolve lindo. Objeto com chaves dinâmicas? Index signature ou Record. Objeto que vem de uma API e nem tudo é obrigatório? Partial entra em cena.
Vamos ver cada abordagem com código que você copia e usa no seu projeto agora.
Como Tipar Objeto Passo a Passo
Siga esse roteiro pra tipar qualquer objeto que aparecer no caminho:
?. Não force todos como obrigatórios se a lógica não exige.[key: string]: value.Exemplos Práticos
Começando pelo jeito mais comum: interface pra definir objetos.
// Interface - a forma clássica
interface User {
id: number;
name: string;
email: string;
age?: number; // opcional
readonly createdAt: Date; // não pode mudar
}
const user: User = {
id: 1,
name: "Carlos",
email: "carlos@dev.com",
createdAt: new Date(),
};
// user.createdAt = new Date(); // ERRO! readonly
Type alias faz a mesma coisa, com syntax levemente diferente:
// Type alias pra objetos
type Product = {
id: number;
name: string;
price: number;
category: "eletronico" | "roupa" | "comida";
};
// Inline type - pra objetos usados uma vez só
function printUser(user: { name: string; age: number }) {
console.log(`${user.name} tem ${user.age} anos`);
}
Index signatures pra quando as chaves são dinâmicas:
// Index signature - chaves dinâmicas
interface Dictionary {
[key: string]: string;
}
const translations: Dictionary = {
hello: "olá",
goodbye: "tchau",
thanks: "obrigado",
};
// Record - atalho elegante pra index signature
type StatusMap = Record<string, boolean>;
const features: StatusMap = {
darkMode: true,
notifications: false,
beta: true,
};
// Record com chaves limitadas
type Role = "admin" | "user" | "guest";
type Permissions = Record<Role, string[]>;
const perms: Permissions = {
admin: ["read", "write", "delete"],
user: ["read", "write"],
guest: ["read"],
};
Objetos aninhados. O cenário mais real de todos:
// Objetos aninhados com tipos separados
interface Address {
street: string;
city: string;
state: string;
zipCode: string;
}
interface Company {
name: string;
address: Address;
employees: number;
}
interface Employee {
id: number;
name: string;
company: Company;
address: Address; // reutiliza o mesmo tipo
metadata: Record<string, unknown>; // dados extras flexíveis
}
// Partial - todas as props viram opcionais
type UpdateUser = Partial<User>;
// Pick - só algumas props
type UserPreview = Pick<User, "id" | "name">;
// Omit - todas menos algumas
type UserWithoutEmail = Omit<User, "email">;
Erros Comuns
Deslizes que custam horas de debug
Erro 1: Usar 'object' como tipo. O tipo 'object' aceita qualquer objeto mas não dá acesso a nenhuma propriedade. Inútil na prática. Sempre defina a forma exata.
Erro 2: Não marcar campos opcionais. Se a API retorna um campo só às vezes, ele precisa de '?' na tipagem. Senão o TypeScript reclama quando o campo não vem.
Erro 3: Index signature com 'any'. Fazer '[key: string]: any' desliga a proteção de tipos. Use 'unknown' se não sabe o tipo exato, depois faça narrowing.
Erro 4: Tipagem inline gigante. Se o objeto tem mais de 3 campos, crie uma interface ou type separado. Código inline com 10 campos fica ilegível.
Erro 5: Esquecer de usar Partial pra updates. Quando você atualiza um objeto, nem todos os campos vêm. Partial<User> salva sua vida nesses casos.
Checklist: Tipagem de Objetos
Construa com TypeScript de verdade
Tipar objetos é rotina diária de quem trabalha com TypeScript. No CrazyStack, você constrói um SaaS inteiro do zero com tipagem ponta a ponta: models, controllers, services, componentes React, tudo fortemente tipado.
Não é tutorialzinho básico. É um projeto completo que você termina e coloca no ar. Backend em Node.js, frontend em React, banco de dados com Prisma, deploy automatizado. Código profissional do início ao fim.
Continue lendo
Diferença entre Type e Interface no TypeScript
Entenda quando usar type e quando usar interface no TypeScript.
Como Tipar Array no TypeScript
Todas as formas de tipar arrays no TypeScript com exemplos.
Como Usar Generics no TypeScript
Domine generics pra criar código reutilizável e type-safe.
Interface no TypeScript
Quando usar interface