Рекомендации по работе с TypeScript

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

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

Используйте более строгие utility-types

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

Давайте рассмотрим реализацию типа Omit.

type Omit<T, K extends string | number | symbol> = { [P in Exclude<keyof T, K>]: T[P]; }

Главная проблема заключается в том, что в качестве параметра K сюда можно передать несуществующий ключ.

interface Todo {   title: string;   description: string;   completed: boolean;   createdAt: number; }   type TodoPreview = Omit<Todo, "qwerty">;

Для решения данной проблемы я бы предложил вам использовать тип StrictOmit из библиотеки ts-essentials или добавить свою реализацию.

type StrictOmit<T, K extends keyof T> = { [P in Exclude<keyof T, K>]: T[P]; }

Указывайте тип для Object.keys

При работе с Object.keys вы всегда будете получать тип string[], хотя хотелось бы вместо string получать список ключей.

Для решения данной проблемы вы можете явно указать тип для переменной со списком ключей объекта.

interface Todo {   title: string;   description: string;   completed: boolean; }  let todo: Todo = {     title: 'Title',     completed: true,     description: 'Description' };    let todoKeys = Object.keys(todo) as (keyof Todo)[];

Используйте Branding

Branding позволяет сделать проверку типов более строгой. Давайте рассмотрим это на следующем примере.

Есть функция, которая выводит дату в определенном формате.

function dateFormatter(date: string) : void {}

Так же есть объект todo у которого нужно вывести дату с помощью функции dateFormatter

interface Todo {   title: string;   description: string;   completed: boolean;   createdDate: string; }  let todo: Todo = {     title: 'Title',     completed: true,     description: 'Description',     createdDate: '2022-02-26T13:43:59.175Z' };

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

Для решения данной проблемы можно добавить новый тип DateISOString и использовать его для работы с датами.

type DateISOString = string & {     _type: 'date' }  interface Todo {   title: string;   description: string;   completed: boolean;   createdDate: DateISOString; }  let todo: Todo = {     title: 'Title',     completed: true,     description: 'Description',     createdDate: '2022-02-26T13:43:59.175Z' as DateISOString };  function dateFormatter(date: DateISOString) : void {}

Теперь при попытке передать в dateFormatter тип string будет ошибка.