Что такое TypeScript

TypeScript — это надмножество JavaScript, которое добавляет статическую типизацию. Код на TypeScript компилируется в обычный JavaScript, который выполняется в браузере или Node.js.

Зачем нужен TypeScript

JavaScript динамически типизирован: переменная может хранить что угодно, и ошибки всплывают только во время выполнения. В большом проекте это превращается в постоянный поиск опечаток и несоответствий.

TypeScript ловит ошибки на этапе компиляции — до того, как код запустится.

function greet(name: string) {
    return `Привет, ${name}`;
}

greet(42); // ошибка компиляции: number не является string

Как это работает

TypeScript — это надмножество. Любой валидный JS-код — валидный TS-код. Ты пишешь .ts или .tsx файлы, компилятор (tsc) проверяет типы и генерирует .js.

main.ts  ──►  tsc  ──►  main.js

В браузер попадает только скомпилированный JS. Типы стираются.

Что даёт TypeScript

• Раннее обнаружение ошибок — компилятор проверяет типы
• Автодополнение — редактор знает, какие поля есть у объекта
• Рефакторинг — переименование безопасно
• Документация — типы описывают, что функция ожидает и возвращает
• Масштабирование — большие проекты легче поддерживать

Где используется

• React, Vue, Angular — все современные фронтенд-фреймворки поддерживают TS
• Node.js — серверный код
• Next.js — из коробки
• Библиотеки — большинство популярных пакетов имеют типы

Минусы

• Нужно учить синтаксис типов
• Компиляция занимает время
• Иногда типы сложны (дженерики, условные типы)
• Не все библиотеки имеют хорошие типы

Когда НЕ нужен TypeScript

• Маленький скрипт на 20 строк
• Прототип, который выбросят
• Обучение базовому JS

Во всех остальных случаях TypeScript окупается.

Версии и совместимость

TypeScript развивается: 5.x — актуальная ветка. Компилятор совместим с современными стандартами ECMAScript.

Как начать

npm install -D typescript
npx tsc --init

Появится tsconfig.json — конфигурация компилятора.

Итоги

• TypeScript — JS + типы
• Ошибки ловятся на этапе компиляции
• Компилируется в обычный JS
• Даёт автодополнение, рефакторинг, документацию
• Стандарт для современных проектов