0Pricing
TypeScript Academy · Урок

// @ts-check в JS; JSDoc для получения типов

Включайте проверку типов в .js с помощью // @ts-check и JSDoc; добавляйте @param/@returns, @type/@typedef и @template для обобщённых шаблонов; настраивайте tsconfig для постепенной миграции.

«// @ts-check в JS; JSDoc для получения типов» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 1 из 1. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 1 уроков всего.

Введение

Цель: использовать преимущества TypeScript внутри файлов .js. Вы включите // @ts-check, добавите типы JSDoc и настроите tsconfig для постепенного внедрения.

  • Проверка отдельных файлов и всего проекта
  • @param, @returns, @type, @typedef
  • @template для вспомогательных функций, подобных обобщённым

Включение проверки

Добавьте // @ts-check в начало файла .js. Используйте @param/@returns, чтобы документировать и типизировать функцию.

// 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, чтобы определить повторно используемую структуру, и @type, чтобы аннотировать переменные. Необязательные поля помечаются с помощью ?.

// 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}!`
}

Параметры шаблона

@template вводит параметры типов для функций, подобных обобщённым, в JS. Вывод типов работает в местах вызова.

// 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 для JS

Для всего проекта: включите checkJs для всех файлов .js. Установите allowJs, чтобы включить файлы JS в программу. Используйте noEmit, когда выводом занимается сборщик.

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

Советы по миграции

Советы по миграции:

  • Начните с критически важных файлов, используя // @ts-check.
  • Создайте небольшие @typedef для общих структур.
  • Постепенно переименовывайте часто используемые участки в .ts, когда типы стабилизируются.

Проверка ts-check

Быстрая проверка: как включить проверку TS в файле .js?

Повторение

Повторение: включите // @ts-check, добавьте @param/@returns/@typedef/@template и ужесточите настройки tsconfig для проектов на JS перед миграцией в .ts.

Часто задаваемые вопросы

Урок «// @ts-check в JS; JSDoc для получения типов» бесплатный?

Да — полный текст урока «// @ts-check в JS; JSDoc для получения типов» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 1 уроков всего.

Чему я научусь в уроке «// @ts-check в JS; JSDoc для получения типов»?

Включайте проверку типов в .js с помощью // @ts-check и JSDoc; добавляйте @param/@returns, @type/@typedef и @template для обобщённых шаблонов; настраивайте tsconfig для постепенной миграции. Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать TypeScript Academy?

Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 1.

Сколько времени занимает урок «// @ts-check в JS; JSDoc для получения типов»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке TypeScript Academy?

Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

← Назад к TypeScript Academy