Что происходит при компиляции TypeScript-кода в JavaScript?
TypeScript не выполняется напрямую в браузере или среде Node.js. Его главная задача — предоставить систему строгой типизации и дополнительные возможности языка, которые затем преобразуются в чистый JavaScript. Процесс компиляции делает этот переход возможным, убирая всю типовую информацию и оставляя только валидный JS-код, который может работать в любой среде, где поддерживается JavaScript.
Удаление информации о типах
Первое, что происходит при компиляции — это удаление всей информации о типах. Объявления типов, интерфейсы, аннотации аргументов и возвращаемых значений, дженерики — все это существует только на этапе разработки. В итоговом JavaScript коде от них не остается ни следа. Это объясняется тем, что JavaScript как язык не поддерживает статическую типизацию.
Проверка на ошибки и предупреждения
Перед тем как сгенерировать JavaScript, компилятор tsc анализирует код и проверяет его на корректность: соответствие типов, наличие обязательных параметров, корректность интерфейсов и наследования. Если обнаружены ошибки, процесс компиляции может завершиться с сообщением об ошибках или сгенерировать код в зависимости от настроек в tsconfig.json.
Преобразование синтаксиса
TypeScript поддерживает множество возможностей, которые могут отсутствовать в целевой версии JavaScript. Например, современные синтаксические конструкции вроде async/await, деструктуризации или модулей могут быть преобразованы в более старые аналоги для совместимости. То, как именно происходит это преобразование, зависит от параметра target в tsconfig.json. Если задан ES5, компилятор перепишет современный синтаксис в старый; если ES2020, то большая часть синтаксиса сохранится.
Обработка модулей
TypeScript позволяет использовать разные системы модулей: ESModules, CommonJS, AMD и другие. При компиляции компилятор преобразует директивы import и export в ту форму, которая соответствует указанной системе модулей в настройках. Это дает возможность использовать код как в браузере, так и в Node.js.
Генерация дополнительных файлов
В зависимости от конфигурации компиляции могут создаваться вспомогательные файлы. Например, если в настройках указано declaration: true, компилятор создаст .d.ts файлы — декларации типов, которые нужны для совместимости с другими TypeScript-проектами. Также могут генерироваться карты исходников (.map), которые упрощают отладку, позволяя в браузере работать с исходным TS-кодом вместо скомпилированного JS.
Оптимизации и трансформации
Компилятор не выполняет сложных оптимизаций, как это делают, например, сборщики или минификаторы, но он выполняет упрощения кода. Например, убирает лишние конструкции, связанные с типами, и минимально адаптирует код для выбранной платформы. Для более глубокой оптимизации обычно подключают такие инструменты, как Webpack или esbuild.
Итоговый результат
В результате компиляции разработчик получает JavaScript-код, полностью очищенный от типовых аннотаций, но эквивалентный с точки зрения логики исходному TS-коду. Этот код можно запускать в любой среде, где поддерживается выбранный стандарт JavaScript.