Como obter chaves de interface TypeScript como array de strings em 2025

Introdução: Por que você precisa de chaves de interface como array?

Imagine: você está trabalhando em um grande projeto em TypeScript e precisa percorrer todos os campos de um objeto complexo, criar um formulário dinâmico em React, filtrar dados ou apenas listar as propriedades disponíveis. O problema é que TypeScript é uma extensão do JavaScript, e seus tipos existem apenas durante a compilação. Em tempo de execução, eles desaparecem. Como fazer? Como obter chaves de interface TypeScript como um array de strings para usá-las em código real?

Uma pergunta que atormenta milhares de desenvolvedores no Stack Overflow. Hoje, em 2025, vamos analisar todas as abordagens possíveis: desde as simples e confiáveis até as avançadas. Você aprenderá como fazer o TypeScript trabalhar a seu favor, e não contra você. Vamos lá!

O Problema: Tipos "Desaparecendo"

Vamos direto à raiz do problema. Suponha que você tenha esta interface:

interface User {  id: number;  name: string;  email: string;  isAdmin: boolean;}

Você precisa obter um array de strings: ['id', 'name', 'email', 'isAdmin']. A primeira coisa que vem à mente é usar Object.keys(). Mas há um detalhe. Se você tentar escrever assim:

const keys = Object.keys({} as User);// Tipo: string[]

TypeScript retornará o tipo string[], e não ('id' | 'name' | 'email' | 'isAdmin')[]. Isso é inútil — você perde todas as informações sobre as chaves específicas.

Por que isso acontece? Porque Object.keys() em JavaScript sempre retorna um array de strings. TypeScript não pode saber com certeza quais chaves um objeto terá em tempo de execução (por exemplo, se o objeto for estendido). Portanto, ele fornece o tipo mais seguro, mas inútil.

Solução 1: Array "Manual" (Simplicidade e Segurança)

A maneira mais simples e recomendada para 90% dos casos é criar o array manualmente e inferir o tipo a partir dele. Não é brincadeira. Essa abordagem garante que seu array estará sempre sincronizado com a interface.

// 1. Definimos o array de chavesexport const USER_KEYS = ['id', 'name', 'email', 'isAdmin'] as const;

// 2. Inferimos o tipo a partir do arraytype UserKey = typeof USER_KEYS[number]; // 'id' | 'name' | 'email' | 'isAdmin'

// 3. Usamos para a interfaceinterface User {  [key in UserKey]: key extends 'id' ? number     : key extends 'name' ? string     : key extends 'email' ? string     : boolean;}

// 4. Obtemos o array de stringsconst keys: string[] = [...USER_KEYS];console.log(keys); // ['id', 'name', 'email', 'isAdmin']

Vantagens: Tipagem completa, sem truques mágicos, fácil de ler e manter.

Desvantagens: É necessário manter dois lugares (interface e array) manualmente.

Solução 2: Tipo Utilitário com keyof (Avançado, mas com Ressalvas)

TypeScript fornece o operador keyof, que retorna uma união de chaves (union type). Mas como transformar essa união em um array de strings? Em 2025, isso ainda requer um pequeno truque.

A maneira clássica é usar uma função auxiliar que verifica os tipos durante a compilação:

// Função auxiliarfunction getKeys<T>(obj: T): (keyof T)[] {  return Object.keys(obj) as (keyof T)[];}

// Usointerface Product {  title: string;  price: number;  inStock: boolean;}

const product: Product = {  title: 'Keyboard',  price: 100,  inStock: true};

const productKeys = getKeys(product);// Tipo: ("title" | "price" | "inStock")[]console.log(productKeys); // ['title', 'price', 'inStock']

Importante: Este método só funciona se você tiver um objeto real correspondente à interface. Se você tiver apenas a interface, mas não o objeto, será necess