TypeScript: Instalação, Configuração e Primeiros Tipos na Prática Já leu

Instalação e Configuração Inicial TypeScript é um superconjunto de JavaScript que adiciona tipagem estática opcional. Antes de começar, você precisa do Node.js instalado em sua máquina. Acesse nodejs.org e baixe a versão LTS (Long Term Support). Após a instalação, abra o terminal e instale TypeScript globalmente: Verifique a instalação com . Para um projeto específico, é recomendado instalar TypeScript localmente: Agora crie o arquivo de configuração na raiz do projeto. Execute para gerar um arquivo padrão. Este arquivo controla como o TypeScript compila seu código. As propriedades mais importantes são (versão JavaScript alvo), (sistema de módulos), e (pasta de saída compilada). Estrutura de Projeto Recomendada Organize seu projeto assim: crie uma pasta para arquivos TypeScript e uma pasta para o JavaScript compilado. Atualize seu : A opção ativa as verificações mais rigorosas de tipo — essencial para aproveitar TypeScript ao máximo. Tipos Primitivos e Anotação TypeScript oferece inferência automática de tipos, mas você também pode anotar explicitamente. Os tipos primitivos

Instalação e Configuração Inicial

TypeScript é um superconjunto de JavaScript que adiciona tipagem estática opcional. Antes de começar, você precisa do Node.js instalado em sua máquina. Acesse nodejs.org e baixe a versão LTS (Long Term Support). Após a instalação, abra o terminal e instale TypeScript globalmente:

npm install -g typescript

Verifique a instalação com tsc --version. Para um projeto específico, é recomendado instalar TypeScript localmente:

npm init -y
npm install --save-dev typescript

Agora crie o arquivo de configuração tsconfig.json na raiz do projeto. Execute npx tsc --init para gerar um arquivo padrão. Este arquivo controla como o TypeScript compila seu código. As propriedades mais importantes são target (versão JavaScript alvo), module (sistema de módulos), e outDir (pasta de saída compilada).

Estrutura de Projeto Recomendada

Organize seu projeto assim: crie uma pasta src/ para arquivos TypeScript e uma pasta dist/ para o JavaScript compilado. Atualize seu tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "lib": ["ES2020"],
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

A opção strict: true ativa as verificações mais rigorosas de tipo — essencial para aproveitar TypeScript ao máximo.

Tipos Primitivos e Anotação

TypeScript oferece inferência automática de tipos, mas você também pode anotar explicitamente. Os tipos primitivos são: string, number, boolean, null, undefined e symbol. Veja exemplos práticos:

// Anotação explícita
let nome: string = "João";
let idade: number = 28;
let ativo: boolean = true;
let vazio: null = null;
let indefinido: undefined = undefined;

// Inferência implícita (TypeScript adivinha o tipo)
let cidade = "São Paulo"; // tipo: string
let salario = 5000; // tipo: number

// Union types (múltiplos tipos permitidos)
let id: string | number;
id = "USR001"; // ✓ válido
id = 123; // ✓ válido
id = true; // ✗ erro

O compilador verificará esses tipos em tempo de desenvolvimento, evitando erros antes mesmo de executar o código. Use npx tsc para compilar seus arquivos TypeScript para JavaScript. Se houver erros de tipo, a compilação falhará e você verá mensagens descritivas.

Tipos Literais e any

Às vezes você precisa ser mais específico. Tipos literais permitem valores exatos:

let direcao: "esquerda" | "direita" | "cima" | "baixo";
direcao = "esquerda"; // ✓ válido
direcao = "diagonal"; // ✗ erro

// Evite 'any' - ele desativa a verificação de tipos
let dado: any = "texto";
dado = 123; // ✓ válido, mas sem segurança

Objetos e Interfaces

Objetos são estruturas complexas. Você pode tipar suas propriedades diretamente ou usar interfaces:

// Tipagem inline
let usuario: { nome: string; idade: number; email?: string } = {
  nome: "Maria",
  idade: 30
};

// Interface (mais reutilizável)
interface Usuario {
  nome: string;
  idade: number;
  email?: string; // propriedade opcional
  ativo: boolean;
}

const meuUsuario: Usuario = {
  nome: "Carlos",
  idade: 25,
  ativo: true
};

Interfaces são a forma padrão de definir contratos em TypeScript. A propriedade email? é opcional (pode não estar presente). Você também pode definir tipos com type, que oferece mais flexibilidade:

type ID = string | number;

type Produto = {
  id: ID;
  titulo: string;
  preco: number;
  descricao?: string;
};

const produto: Produto = {
  id: "P001",
  titulo: "Notebook",
  preco: 3000
};

Funções com Tipos

Funções precisam ter tipos para seus parâmetros e retorno:

// Anotação de parâmetros e retorno
function saudar(nome: string): string {
  return `Olá, ${nome}!`;
}

// Arrow function com tipos
const calcularDesconto = (preco: number, percentual: number): number => {
  return preco * (1 - percentual / 100);
};

// Função sem retorno (void)
function exibir(mensagem: string): void {
  console.log(mensagem);
}

// Múltiplos retornos
function buscarDado(id: number): string | null {
  if (id > 0) return `Dado ${id}`;
  return null;
}

console.log(saudar("Pedro")); // Olá, Pedro!
console.log(calcularDesconto(100, 20)); // 80

Definir tipos para funções ajuda a evitar bugs — o compilador garante que você esteja passando os argumentos corretos e usando o retorno adequadamente.

Compilação e Execução

Compile seu código TypeScript com:

npx tsc

Isso gerará arquivos .js na pasta dist/. Para facilitar o desenvolvimento, use o modo watch:

npx tsc --watch

O TypeScript monitorará mudanças e recompilará automaticamente. Execute o JavaScript compilado com Node:

node dist/seu-arquivo.js

Para melhor experiência durante o desenvolvimento, instale o ts-node, que executa TypeScript diretamente sem compilação intermediária:

npm install --save-dev ts-node
npx ts-node src/seu-arquivo.ts

Conclusão

TypeScript adiciona segurança de tipo ao JavaScript sem deixar de ser JavaScript. Você aprendeu a: (1) instalar e configurar TypeScript corretamente, estabelecendo um ambiente profissional; (2) utilizar tipos primitivos e complexos para documentar e proteger seu código; (3) trabalhar com interfaces e funções tipadas, evitando erros em tempo de desenvolvimento.

Comece tipando gradualmente. Não precisa ser perfeito desde o início — TypeScript aprende suas intenções conforme você escreve. Pratique escrevendo pequenos programas, compilando frequentemente e observando os erros de tipo. Com o tempo, essa abordagem defensiva se tornará natural e você escreverá código mais robusto e mantenível.

Referências


Artigos relacionados