Время чтения: Около 6 мин. Веб-разработка

Что такое TypeScript

Что такое TypeScript

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

Прежде, чем начать, разберемся с определениями. JavaScript — один из самых популярных языков программирования в мире. Он используется для создания динамических веб-страниц, мобильных приложений, игр и других интерактивных проектов. Однако JavaScript имеет свои недостатки: он слабо типизирован, подвержен ошибкам и не всегда удобен для работы с большими и сложными кодовыми базами.

TypeScript — это расширение JavaScript, которое добавляет к нему возможность строгой типизации данных. TypeScript позволяет лучше контролировать структуру и поведение кода, обнаруживать ошибки на этапе разработки и ускорять процесс компиляции JS. TypeScript также поддерживает объектно-ориентированный подход к программированию, который облегчает организацию кода и повторное использование компонентов.

TypeScript — что это?

TypeScript — это язык программирования, который является надстройкой над JavaScript. Это означает, что любой корректный код на JavaScript также является корректным кодом на TypeScript. Однако TypeScript добавляет к JavaScript дополнительный синтаксис для описания типов данных (числа, строки, булевы значения и т.д.), которые используются в переменных, функциях и объектах.

TypeScript не выполняется напрямую браузерами или другими средами исполнения JavaScript. Для того чтобы запустить код на TypeScript, его нужно скомпилировать в обычный JavaScript с помощью специального инструмента — компилятора TypeScript (tsc). Компилятор проверяет код на соответствие правилам типизации и генерирует эквивалентный код на JavaScript.

TypeScript был создан командой разработчиков Microsoft в 2012 году как ответ на растущую сложность приложений на JavaScript. С тех пор TypeScript получил широкое распространение и поддержку со стороны многих фреймворков (Angular, React) и библиотек (jQuery). Сейчас TypeScript занимает 7-е место по популярности среди языков программирования по версии GitHub.

Отличия TypeScript от JavaScript

Строгая типизация

Основное отличие TypeScript от JavaScript заключается в том, что TypeScript поддерживает строгую типизацию данных. Это значит, что каждая переменная или параметр функции должен иметь определенный тип данных (number, string, boolean и т.д.), который не может быть изменен в ходе выполнения программы.

Строгая типизация позволяет избежать многих ошибок в коде, которые могут привести к непредвиденным результатам или сбоям в работе программы. Кроме того, строгая типизация улучшает читаемость и понимание кода, а также облегчает его рефакторинг и поддержку.

Объектно-ориентированный подход

TypeScript поддерживает концепции из классического объектно-ориентированного программирования (ООП), такие как классы, интерфейсы, наследование и т.д. Парадигма ООП способствует созданию хорошо организованного и масштабируемого кода, а этот преимущество становится более очевидным по мере роста размера и сложности проекта.

TypeScript также позволяет использовать новые возможности JavaScript для работы с объектами и классами, такие как деструктуризация (destructuring), расширение объектов (object spread), декораторы (decorators) и другие.

Высокая скорость работы над проектом

TypeScript ускоряет процесс разработки приложений на нескольких уровнях. Во-первых, он предоставляет отличную интеграцию с современными IDE (интегрированными средами разработки), такими как Visual Studio Code или WebStorm. Эти IDE обеспечивают автодополнение кода (code completion), подсветку синтаксиса (syntax highlighting), переход к определению (go to definition) и другие полезные функции.

Во-вторых, TypeScript облегчает отладку кода за счет возможности использования точек останова (breakpoints) и просмотра значений переменных в режиме отладки (debug mode). Кроме того, TypeScript позволяет использовать инструменты для тестирования кода на разных уровнях: модульном (unit testing), интеграционном (integration testing) и функциональном (functional testing).

В-третьих, TypeScript упрощает работу в команде за счет повышения читаемости и понятности кода. Благодаря типизации данных легче понять назначение переменных и функций, а также избежать конфликтов при слиянии изменений в общий репозиторий.

Преимущества TypeScript

Исходя из вышеизложенного, можно выделить следующие преимущества TypeScript:

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

Строгая типизация. TypeScript поддерживает строгую типизацию данных, которая помогает избегать многих проблем, связанных с несоответствием или неявным преобразованием типов. Строгая типизация также улучшает читаемость и понимание кода, а также облегчает его рефакторинг и поддержку.

Быстрая компиляция. TypeScript обеспечивает быструю компиляцию кода в JavaScript с помощью специального инструмента – компилятора TypeScript (tsc). Компилятор проверяет код на соответствие правилам типизации и генерирует эквивалентный код на JavaScript, который может быть запущен в любом браузере или сервере с поддержкой JavaScript.

Открытый исходный код. TypeScript является открытым и бесплатным проектом, который развивается и поддерживается командой разработчиков Microsoft в соответствии с открытой лицензией Apache 2.01. TypeScript также имеет большое сообщество пользователей и разработчиков, которые вносят свой вклад в улучшение языка.

Недостатки TypeScript

Несмотря на все преимущества TypeScript, он также имеет некоторые недостатки, которые нужно учитывать при выборе языка для своего проекта:

  1. Необходимость компиляции. TypeScript требует дополнительного шага компиляции кода в JavaScript перед тем, как он сможет быть запущен в браузере или сервере. Этот шаг может замедлить время сборки и усложнить настройку инструментов для сборки (bundlers).  
  2. Невозможность типизировать ошибки. TypeScript не позволяет указывать типы данных для ошибок (exceptions), которые могут возникать в коде. Это означает, что нельзя гарантировать, что обработчик ошибок (catch block) получит ожидаемый тип ошибки.   
  3. Не все браузеры поддерживают вкладку TypeScript в консоли.  TypeScript предоставляет возможность просматривать исходный код на TypeScript в консоли браузера при отладке программы. Однако не все браузеры поддерживают эту функцию, например Safari.  
  4. Нетривиальные классы. TypeScript поддерживает классы как способ организации кода и наследования поведения. Однако классы в TypeScript не являются полноценными объектами первого класса (first-class objects), то есть они не могут быть переданы как параметры или возвращены из функций. Это может привести к сложностям при работе с функциональным программированием или метапрограммированием.  
  5. Возможность отключить строгую типизацию словом any. TypeScript позволяет использовать специальный тип данных any для обозначения любого значения без проверки его типа. Это может быть полезно для работы с динамическими данными или сторонними библиотеками, которые не имеют файлов определения типов  (declaration files). Однако использование any также может привести к потере всех преимуществ строгой типизации и увеличению риска ошибок.

Установка TypeScript

TypeScript можно установить разными способами в зависимости от того, как вы собираетесь использовать его в своих проектах:

Через npm. TypeScript доступен как пакет на реестре npm под именем “typescript”. Вам понадобится копия Node.js как среды для запуска пакета. Затем вы используете менеджер зависимостей, такой как npm, yarn или pnpm, чтобы загрузить TypeScript в свой проект. Для этого выполните команду: npm install typescript --save-dev. Все эти менеджеры зависимостей поддерживают файлы блокировки (lockfiles), обеспечивающие одинаковость версий TypeScript для всех участников вашей команды. Вы можете запустить компилятор TypeScript с помощью одной из следующих команд: npx tsс.

Через Visual Studio. Для большинства типов проектов вы можете получить TypeScript как пакет в Nuget для ваших проектов MSBuild, например приложения ASP.NET Core. При использовании Nuget вы можете установить TypeScript через Visual Studio с помощью: окна “Управление пакетами NuGet” (которое можно открыть щелкнув правой кнопкой мыши по узлу проекта) или консоли менеджера пакетов Nuget (найдите в Инструменты > Менеджер пакетов NuGet > Консоль менеджера пакетов) и затем выполните: Install-Package Microsoft.TypeScript.MSBuild. Для типов проектов, которые не поддерживают Nuget, вы можете использовать расширение TypeScript для Visual Studio. Вы можете установить расширение с помощью Расширения > Управление расширениями в Visual Studio.

Как работает TypeScript?

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

Компилятор TypeScript — это инструмент, который принимает на вход файлы с расширением .ts (TypeScript) и выдает файлы с расширением .js (JavaScript). Компилятор можно запускать из командной строки или из интегрированных сред разработки (IDE), таких как Visual Studio Code или WebStorm. Компилятор также поддерживает различные опции для настройки процесса компиляции, например:

  1. target — определяет версию JavaScript, в которую будет транспилирован код TypeScript. Например, target: “es5” означает, что код будет совместим с браузерами и серверами, которые поддерживают стандарт ECMAScript 5.
  2. module — определяет формат модулей, которые будут  использоваться в скомпилированном коде. Например, module: “commonjs” означает, что модули будут соответствовать спецификации CommonJS, используемой в Node.js.
  3. sourceMap — определяет нужно ли генерировать файлы карт исходного кода (source maps), которые позволяют отслеживать  связь между строками TypeScript и JavaScript при отладке программы.

Опции компилятора можно указывать как аргументы командной строки или как свойства объекта compilerOptions в файле конфигурации tsconfig.json. Файл конфигурации также позволяет указывать файлы и папки, которые должны быть включены или исключены из процесса компиляции.

Пример файла конфигурации tsconfig.json:

 {
      "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "sourceMap": true,
        "strict": false,
        "noImplicitAny": false,
        "strictPropertyInitialization": false,
        "esModuleInterop": true,
      },

Пример команды для запуска компилятора TypeScript:

tsc --project tsconfig.json

Заключение

TypeScript — это язык программирования, который расширяет возможности JavaScript за счет добавления строгой типизации данных. TypeScript позволяет лучше контролировать структуру и поведение кода, обнаруживать ошибки на этапе разработки и ускорять процесс компиляции. TypeScript также поддерживает объектно-ориентированный подход к программированию, который облегчает организацию кода и повторное использование компонентов.

TypeScript имеет ряд преимуществ перед JavaScript, таких как: 

  1. Удобный поиск ошибок
  2. Строгая типизация
  3. Быстрая компиляция
  4. Открытый исходный код.

Однако TypeScript также имеет некоторые недостатки, которые нужно учитывать при выборе языка для своего проекта, например:

  1. Необходимость компиляции
  2. Невозможность типизировать ошибки
  3. Не все браузеры поддерживают вкладку TypeScript в консоли
  4. Нетривиальные классы
  5. Возможность отключить строгую типизацию словом any.  

Для того чтобы использовать TypeScript в своих проектах, необходимо установить компилятор TypeScript через npm или Visual Studio. Компилятор TypeScript принимает на вход файлы с расширением .ts (TypeScript) и выдает файлы с расширением .js (JavaScript). Компилятор можно запускать из командной строки или из интегрированных сред разработки (IDE). Компилятор также поддерживает различные опции для настройки процесса компиляции.

Elbrus Bootcamp