0Pricing
TypeScript Academy · Aula

// @ts-check em JS; JSDoc para obter tipos

Ative a verificação de tipos em .js com // @ts-check e JSDoc; adicione @param/@returns, @type/@typedef e @template para padrões genéricos; configure o tsconfig para uma migração gradual.

// @ts-check em JS; JSDoc para obter tipos é uma aula grátis de TypeScript Academy no CoddyKit. Esta é a aula 1 de 1. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de TypeScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de TypeScript Academy inclui 1 aulas no total.

Introdução

Objetivo: obter os benefícios do TypeScript dentro de arquivos .js. Você ativará // @ts-check, adicionará tipos JSDoc e configurará tsconfig para uma adoção gradual.

  • Verificação por arquivo e em todo o projeto
  • @param, @returns, @type, @typedef
  • @template para funções auxiliares semelhantes a genéricas

Ativar a verificação

Adicione // @ts-check no início de um arquivo .js. Use @param/@returns para documentar e tipar a função.

// calculator.js
// @ts-check

/**
 * Adds two numbers.
 * @param {number} a
 * @param {number} b
 * @returns {number}
 */
export function add(a, b) {
  return a + b
}

// Usage: type errors appear if you pass non-numbers
// add("2", 3) // TS will flag this in JS

Typedef e tipo

Use @typedef para definir uma estrutura reutilizável e @type para anotar variáveis. Os campos opcionais são marcados com ?.

// models.js
// @ts-check

/** @typedef {{ id: string; name: string; age?: number }} User */

/** @type {User} */
export const currentUser = { id: "u1", name: "Ada" }

/**
 * Greets a user.
 * @param {User} u
 * @returns {string}
 */
export function greet(u) {
  return `Hello, ${u.name}!`
}

Parâmetros de modelo

@template introduz parâmetros de tipo para funções semelhantes a genéricas em JS. A inferência funciona nos locais de chamada.

// helpers.js
// @ts-check

/**
 * Maps items with a function, preserving types.
 * @template T,U
 * @param {T[]} items
 * @param {(x: T) => U} f
 * @returns {U[]}
 */
export function map(items, f) {
  const out = []
  for (const x of items) out.push(f(x))
  return out
}

// Inference: T=number, U=string
// map([1,2], n => n.toFixed(2))

tsconfig para JS

Em todo o projeto: ative checkJs para todos os arquivos .js. Defina allowJs para incluir arquivos JS no programa. Use noEmit quando um empacotador cuidar da saída.

// tsconfig.json
{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "checkJs": true,
    "allowJs": true,
    "strict": true,
    "noEmit": true
  },
  "include": ["./**/*.js"],
  "exclude": ["node_modules"]
}

Dicas de migração

Dicas de migração:

  • Comece pelos arquivos críticos usando // @ts-check.
  • Crie pequenos @typedefs para estruturas compartilhadas.
  • Renomeie gradualmente os caminhos mais usados para .ts quando os tipos estiverem estáveis.

Verificação do ts-check

Verificação rápida: como ativar a verificação do TS em um arquivo .js?

Recapitulação

Recapitulação: ative // @ts-check, adicione @param/@returns/@typedef/@template e torne o tsconfig mais rigoroso para projetos JS antes de migrar para .ts.

Perguntas Frequentes

A aula “// @ts-check em JS; JSDoc para obter tipos” é grátis?

Sim — o texto completo de “// @ts-check em JS; JSDoc para obter tipos” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de TypeScript Academy, atualize para CoddyKit PRO. O curso de TypeScript Academy inclui 1 aulas no total.

O que vou aprender em “// @ts-check em JS; JSDoc para obter tipos”?

Ative a verificação de tipos em .js com // @ts-check e JSDoc; adicione @param/@returns, @type/@typedef e @template para padrões genéricos; configure o tsconfig para uma migração gradual. Você pratica TypeScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar TypeScript Academy?

Nenhuma experiência prévia é necessária. TypeScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 1 de 1.

Quanto tempo leva a aula “// @ts-check em JS; JSDoc para obter tipos”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de TypeScript Academy?

Sim. Cada aula de TypeScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

← Voltar para TypeScript Academy