Перейти к основному содержимому

[Easy] TypeScript vs JavaScript

1. Что такое TypeScript?​

Как TypeScript связан с JavaScript?

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

  • Весь валидный JavaScript является валидным TypeScript
  • Код TypeScript компилируется в JavaScript перед выполнением
  • Ошибки типов обнаруживаются во время разработки, а не только во время выполнения

2. TypeScript vs JavaScript на первый взгляд​

ТемаJavaScriptTypeScript
Система типовДинамическаяСтатическая + с выводом типов
Этап компиляцииНе требуетсяТребуется (tsc или сборщик)
Обнаружение ошибокВ основном во время выполненияВо время компиляции + во время выполнения
Поддержка рефакторингаБазоваяСильная
Кривая обученияНижеВыше

3. Сравнение на примере (Example Comparison)​

JavaScript​

function add(a, b) {
  return a + b;
}

console.log(add(1, '2')); // "12" (возможно, непреднамеренно)

TypeScript​

function add(a: number, b: number): number {
  return a + b;
}

// add(1, '2'); // ошибка на этапе компиляции
console.log(add(1, 2));

TypeScript помогает предотвратить случайные ошибки приведения типов.

4. Процесс компиляции (Compilation Flow)​

  1. Пишите .ts или .tsx
  2. Проверка типов компилятором TypeScript
  3. Генерация JavaScript
  4. Выполнение JavaScript в браузере или Node.js

В продакшн вы всё равно поставляете JavaScript.

5. Преимущества TypeScript (Advantages)​

  • Более раннее обнаружение ошибок
  • Лучшее автодополнение и навигация в IDE
  • Более безопасный крупномасштабный рефакторинг
  • Более чёткие контракты API между командами

6. Компромиссы TypeScript (Trade-offs)​

  • Требует настройки (tsconfig, сборочный конвейер)
  • Добавляет синтаксис и концепции типов
  • Может быть избыточно многословным при неправильном использовании

7. Когда что выбирать (When to Choose Which)​

Выбирайте JavaScript, когда:

  • Скорость прототипирования — главный приоритет
  • Масштаб проекта маленький и краткосрочный

Выбирайте TypeScript, когда:

  • Размер проекта или команды средний или большой
  • Важно долгосрочное сопровождение
  • Публичные API нуждаются в строгих контрактах

8. Стратегия миграции с JavaScript (Migration Strategy)​

  1. Включите TypeScript с allowJs
  2. Конвертируйте модули с высоким риском первыми
  3. Постепенно включайте strict
  4. Заменяйте any на точные типы со временем

Этот инкрементальный подход минимизирует нарушения.

9. Краткие ответы для собеседования (Quick Interview Answers)​

В1: Выполняется ли TypeScript напрямую браузерами?​

Нет. Браузеры выполняют JavaScript, поэтому TypeScript сначала должен быть скомпилирован.

В2: Гарантирует ли TypeScript ноль ошибок во время выполнения?​

Нет. Он ловит многие ошибки, связанные с типами, но логические ошибки во время выполнения всё ещё возможны.

В3: Обязателен ли TypeScript для React?​

Нет. React работает и с JavaScript, и с TypeScript; TypeScript опционален, но распространён в продакшн-приложениях.