Проекты на JS, использующие TypeScript

Система типов в TypeScript имеет различные уровни строгости при работе с кодовой базой:

• Система типов, основанная только на выводе типов из кода JavaScript
• Инкрементная типизация в JavaScript через JSDoc
• Использование // @ts-check в файле JavaScript
• Код TypeScript
• TypeScript с strict включённым

Каждый шаг представляет собой движение к более безопасной системе типов, но не каждый проект нуждается в таком уровне проверки.

TypeScript с JavaScript

Это когда вы используете редактор, который использует TypeScript для предоставления инструментов, таких как автодополнение, переход к символу и инструменты рефакторинга, например, переименование. На главной странице есть список редакторов с плагинами TypeScript.

Предоставление подсказок типов в JS через JSDoc

В файле .js типы часто можно вывести. Когда типы нельзя вывести, их можно указать с помощью синтаксиса JSDoc.

Аннотации JSDoc помещаются перед объявлением и используются для установки типа этого объявления. Например:

/** @type {number} */
var x;
 
x = 0; // OK
x = false; // OK?!

Полный список поддерживаемых шаблонов JSDoc можно найти в поддерживаемых типах JSDoc.

@ts-check

Последняя строка предыдущего примера кода вызовет ошибку в TypeScript, но по умолчанию в проекте на JS — нет. Чтобы включить ошибки в ваших файлах JavaScript, добавьте: // @ts-check в первую строку ваших .js файлов, чтобы TypeScript поднимал их в качестве ошибки.

// @ts-check
/** @type {number} */
var x;
 
x = 0; // OK
x = false; // Not OK

Если у вас много файлов JavaScript, к которым вы хотите добавить проверки на ошибки, то вы можете перейти к использованию jsconfig.json. Вы можете пропустить проверку некоторых файлов, добавив комментарий // @ts-nocheck в эти файлы.

TypeScript может предложить вам ошибки, с которыми вы не согласны. В таких случаях вы можете игнорировать ошибки на определённых строках, добавив // @ts-ignore или // @ts-expect-error в предшествующей строке.

// @ts-check
/** @type {number} */
var x;
 
x = 0; // OK
// @ts-expect-error
x = false; // Not OK

Чтобы узнать больше о том, как JavaScript интерпретируется TypeScript, прочтите Как TS проверяет типы JS