Недавно TypeScript выпустил последнюю версию языка: V4.0. Он поставляется с несколькими функциями и улучшениями, доступными для самого языка и инструментов. Пока то, что он предлагает, довольно многообещающе. В этой статье я собираюсь представить пять вещей, которые мне нравятся в этом выпуске.
1. Улучшения редактора
Как разработчики, мы проводим большую часть времени, работая с редактором кода. На данный момент я активно пользуюсь VS Code. Поэтому я начну с улучшений редактора VS Code для TS4. Чтобы использовать новейшие функции редактора, вам необходимо переключить версию TS в VS Code на последнюю. Откройте палитру команд, найдите команду TypeScript: Select Version и выберите самую новую версию.
Подсказка по рефакторингу для преобразования в необязательную Цепочку
При работе с вложенными объектами одна из самых болезненных ошибок - отсутствие проверки на undefined или null при доступе к свойству объекта. Рассмотрим следующий пример:
// Approach 1
// This will break if the user is undefined or address
if(user.address.city){ }
// Approach 2
// Can be solved
if(user && user.address && user.address.city){ }
// Approach 3
// With optional chaining
if(user?.address?.city){ }
В TS4 он автоматически предлагает преобразовать в необязательную цепочку всякий раз, когда это применимо. Я использовал подход 2 по большей части, и именно так я начинал писать код, если он обращается к каким-либо внутренним свойствам объекта. Поскольку намекается преобразование в необязательную цепочку, мне легко написать хорошо читаемый код.
Поддержка устаревших комментариев JSDoc
Когда дело доходит до использования сторонних библиотек или модулей, трудно заметить, устарел ли класс или метод, если мы не обратимся к документации. В новом выпуске теперь синтаксис отображается зачеркнутым текстом. Поэтому легко увидеть, какие части вашего кода используют устаревший синтаксис.
Совет: используйте Bit (Github) для совместного использования, документирования и управления повторно используемыми компонентами из разных проектов. Это отличный способ увеличить повторное использование кода, ускорить разработку и создавать масштабируемые приложения.
Bit поддерживает Node, TypeScript, React, Angular, Vue и другие.
2. Поддержка операторов составного присваивания для трех операторов.
Многие языки поддерживают составные операторы присваивания. Я уже являюсь его большим поклонником и предпочитаю использовать его, когда это возможно. Давайте вспомним, как мы вспоминаем составные операторы присваивания, рассмотрев следующий пример.
let attempts: number; attempts = attempts + 5; attempts += 5
Помимо сложения, он поддерживает вычитание, умножение, деление, возведение в степень и сдвиг бит влево. Однако было ограничение с поддержкойlogical and (&&), logical or (||) и nullish coalescing (??) в предыдущей версии TS. С TS4 вы можете без проблем использовать эти операторы с составными присваиваниями.
if (!node.label) {
node.label = generateLabel();
}
// Above can be written as
node.label ||= generateLabel();
3. Возможность маркировать элементы кортежа.
Позвольте мне сначала объяснить разницу между кортежем и массивом. Кортеж - это массив с фиксированным количеством элементов с известными типами. Кортежи могут быть чрезвычайно полезны, когда дело доходит до использования списков аргументов, потому что с помощью кортежей мы можем обеспечить строгую проверку типа.
Один из недостатков кортежей - плохая читабельность. Рассмотрим следующий фрагмент.
type Server = [string, number]
Когда мы читаем код, трудно понять, на что мы ссылаемся, используя эти элементы. Чтобы преодолеть это, TS 4 предоставляет возможность помечать кортежи. Таким образом, мы можем переписать приведенный выше код следующим образом.
type Server = [ipAddress: stirng, port: number]
Выглядит фантастически, правда? Однако при использовании помеченных кортежей следует помнить о том, что помечать должны все элементы или ни один.
// wrong type Server = [ipAddress: string, number]
Мы также можем использовать помеченные кортежи для реализации перегрузок. Одна из замечательных особенностей заключается в том, что редактор использует эти помеченные кортежи для отображения перегрузок.
4. Возможность использовать unknown в catch статьях.
До сих пор тип переменной предложения catch был any. По своей природе any позволяет нам получать доступ к свойствам, даже если свойство недоступно в объекте. Использование `any` затрудняет обработку ошибок в предложениях catch.
С unknown типами мы можем выполнить ручную проверку типа. TS4 дал нам возможность использовать unknown в качестве типа в предложении catch. Теперь мы можем улучшить нашу обработку ошибок, поскольку мы можем сузить ошибку до более конкретного типа.
try{
//Error is thrown
} catch (error: unknown) {
if(typeof error === 'desired error type'){
// handle narrowed down error
} else {
// Generic error handler
}
}
5. Выявление типов свойств класса из конструктора.
В более ранних версиях TypeScript, если мы не упоминали тип для свойства класса, ему неявно присваивался any. В TS4, если мы включим noImplicitAny, он сможет проанализировать все пути конструктора, чтобы определить тип свойства.
class Employee {
userName; // This will be infered as string
constructor (userName: string) {
this.userName = userName;
}
}
Резюме
Выпуск TypeScript 4 (TS4) не имеет большого списка функций. Тем не менее, он поставляется с множеством качественных функций, которые улучшат повседневный опыт разработчика. Помимо пяти упомянутых мною вещей, есть области, которые могут вас заинтересовать. Не стесняйтесь делиться ими в комментариях ниже.
Чтобы узнать больше о выпуске, используйте официальный блог.
