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

Сокращение конструктора со свойствами параметров

Есть способ писать более короткие классы, используя свойства параметров TypeScript. Это сокращение позволяет объявлять свойства класса с теми же именами, что и параметры конструктора класса. Все, что вам нужно сделать, это добавить к параметрам префикс модификаторов видимости.

Взгляните на этот класс:

Здесь мы вручную назначаем параметры, которые конструктор получает, свойствам класса с тем же именем.

Вот как мы можем обрезать этот код, используя свойства параметров:

Нулевое слияние

Нулевое слияние - это новая функция ECMAScript, которую TypeScript недавно начал поддерживать. Оператор объединения с нулевым значением позволяет указать резервное значение для null или undefined. Вот как это выглядит в коде:

Вы можете спросить: «Чем он отличается от логического оператора ИЛИ (||)»? Ответ заключается в том, что нулевой оператор объединения имеет дело конкретно со значениями null и undefined, в то время как оператор OR вернет правый операнд над любым ложным значением, включая null, undefined, пустые строки и нули.

Поля частного класса

Эта функция также взята из ECMAScript. Поле частного класса - это предложение ECMAScript на третьем этапе, принятие которого в сообществе TypeScript растет. Чтобы объявить поле частного класса, вы используете синтаксис #:

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

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

С полями частных классов мы наконец-то получили настоящую конфиденциальность в JavaScript.

Помеченные типы кортежей

Эта функция доступна для TypeScript версии 4.0 и выше. Помеченные типы кортежей улучшают наш опыт работы с кортежами.

Во-первых, давайте кратко рассмотрим, что такое кортежи в TypeScript. Кортежи - это типы массивов фиксированного размера. Типы кортежей должны быть объявлены, хотя не обязательно, чтобы все типы были одинаковыми. Вот пример объявления типа кортежа:

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

Так зачем использовать помеченные типы кортежей? В первую очередь, вы получаете гораздо более приятный опыт автозаполнения при работе с функциями и операторами распространения:

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

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

Литералы типа шаблона

Литералы типа шаблона - это новая функция TypeScript, доступная в версиях 4.1 и выше. Литералы типа шаблона позволяют создавать новые строковые типы из комбинаций нескольких типов объединения.

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

Обратите внимание, как новый тип Position включает все комбинации типов topBottom и leftRight.

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

Типы утилит

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

Вот пример использования утилиты Omit, которая копирует все реквизиты исходного типа, кроме тех, которые вы решили не включать:

Чтобы узнать больше о типах утилит в TypeScript, прочтите мой пост здесь.

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

Первоначально опубликовано на https://isamatov.com 30 июля 2021 г.