Как писать меньше TypeScript интерфейсов?
#typescript
TL;DR Используйте Lookup Types
TypeScript позволяет писать вложенные интерфейсы. Например:
Необходимо создать функцию
Вместо этого следует использовать Lookup Types. Это выглядит так:
Обратите внимание, что всегда используются квадратные скобки и кавычки, а не точка. Такая нотация позволяет делать
#typescript
TL;DR Используйте Lookup Types
TypeScript позволяет писать вложенные интерфейсы. Например:
interface User {
id: number;
name: string;
contacts: {
phone: string;
email: string;
address: {
country: string;
city: string;
street: string;
}
}
}
Необходимо создать функцию
updateUserContact
. Распространённое решение вынести UserСontact
как отдельный интерфейс, или еще хуже продублировать его. Новый интерфейс использовать как тип в функции.Вместо этого следует использовать Lookup Types. Это выглядит так:
type UserСontacts = User['contacts']
type UserAddress = User['contacts']['address']
Обратите внимание, что всегда используются квадратные скобки и кавычки, а не точка. Такая нотация позволяет делать
union
внутри квадратных скобок или использовать keyof
. В завершение пример близкий к продакшен коду:function updateUserContact<T extends keyof User["contacts"]>(
user: User,
contactType: T,
contact: User["contacts"][T]
): void {
// ...
}
www.typescriptlang.org
Documentation - TypeScript 2.1
TypeScript 2.1 Release Notes
Как следить за устареванием кода?
#nodejs_api #typescript
В разработке существует жизненный цикл. Вы можете увидеть его этапы в #nodejs документации в виде stability index. Часть методов помечена как Legacy, т.е. их не стоит использовать как прямо, так и через библиотеки. Аналогичный подход можно использовать в своей кодовой базе. Для этого следует использовать JSdoc
Проверку использования устаревшего кода можно переложить на eslint. Для javascript проектов для этого используется правило import/no-deprecated.
В typescript есть перегрузка функций и устареть может только часть сигнатур. Пример:
Поэтому для typescript проектов следует использовать eslint-plugin-deprecation.
#nodejs_api #typescript
В разработке существует жизненный цикл. Вы можете увидеть его этапы в #nodejs документации в виде stability index. Часть методов помечена как Legacy, т.е. их не стоит использовать как прямо, так и через библиотеки. Аналогичный подход можно использовать в своей кодовой базе. Для этого следует использовать JSdoc
@deprecated
. Пример:/** @deprecated use newFunction instead **/
function oldFunction() {...}
Проверку использования устаревшего кода можно переложить на eslint. Для javascript проектов для этого используется правило import/no-deprecated.
В typescript есть перегрузка функций и устареть может только часть сигнатур. Пример:
function example(userOrId: User): void
/** @deprecated use with User instead of user_id **/
function example(userOrId: number): void
Поэтому для typescript проектов следует использовать eslint-plugin-deprecation.
Как подтянуть TypeScript?
#typescript #code_pattern
Лучший способ тренировки паттернов кодирование это решений задач. Для этого отлично подойдет проект type-challenges. Каждая из задач предлагает написать свой тип. Есть встроенная проверка. Как это работает можно глянуть на Hello World примере.
В Readme проекта задачи отсортированы по темам и уровням сложности. Некоторые задачи начального уровня предлагают реализовать built-in тип, т.е. который уже есть в TypeScript.
#typescript #code_pattern
Лучший способ тренировки паттернов кодирование это решений задач. Для этого отлично подойдет проект type-challenges. Каждая из задач предлагает написать свой тип. Есть встроенная проверка. Как это работает можно глянуть на Hello World примере.
В Readme проекта задачи отсортированы по темам и уровням сложности. Некоторые задачи начального уровня предлагают реализовать built-in тип, т.е. который уже есть в TypeScript.
GitHub
GitHub - type-challenges/type-challenges: Collection of TypeScript type challenges with online judge
Collection of TypeScript type challenges with online judge - type-challenges/type-challenges
Что нового в TypeScript 4.4?
#typescript
24 августа выйдет новая версии TypeScript. Вот краткий пересказ release notes:
– В catch блоках можно включить, что тип ошибки будет unknown, вместо any. Для этого добавлен флаг
– Добавлен флаг
– Добавлена поддержка Class static initialization blocks. Напомню, что при переходе на 16-й версию #nodejs будет поддержка уровне V8, т.е. можно будет использовать и в JS-base проектах.
– Улучшение работы с Index Signatures. До этого это могли быть только number и string. В новой версии добавлены Symbol и template string, а так же разрешены union.
– традиционные изменения в lib.d.ts, который используется по умолчанию, если не указаны lib. Эти изменения являются breaking change. Полный перечень. Если вы используете lib.d.ts в своем проекте, то самое время прочитать Как правильно настроить TypeScript в Node.js проекте?
– улучшена скорость сборки и интеграция с Visual Studio
#typescript
24 августа выйдет новая версии TypeScript. Вот краткий пересказ release notes:
– В catch блоках можно включить, что тип ошибки будет unknown, вместо any. Для этого добавлен флаг
useUnknownInCatchVariables
, который по умолчанию включен с strict флагом. При переходе потребует изменить часть кодовой базы.– Добавлен флаг
--exactOptionalPropertyTypes
, который запрещает для опциональных полей ставить undefined.– Добавлена поддержка Class static initialization blocks. Напомню, что при переходе на 16-й версию #nodejs будет поддержка уровне V8, т.е. можно будет использовать и в JS-base проектах.
– Улучшение работы с Index Signatures. До этого это могли быть только number и string. В новой версии добавлены Symbol и template string, а так же разрешены union.
– традиционные изменения в lib.d.ts, который используется по умолчанию, если не указаны lib. Эти изменения являются breaking change. Полный перечень. Если вы используете lib.d.ts в своем проекте, то самое время прочитать Как правильно настроить TypeScript в Node.js проекте?
– улучшена скорость сборки и интеграция с Visual Studio
Microsoft News
Announcing TypeScript 4.4 RC
Today we’re excited to announce our Release Candidate (RC) of TypeScript 4.4! Between now and the stable release of TypeScript 4.4, we expect no further changes apart from critical bug fixes. To get started using the RC, you can get it through NuGet,
Какие вопросы задать, чтобы проверить уровень TypeScript?
#typescript
Сегодня поделюсь подборкой моих вопросов для интервью по TypeScript. Естественно без ответов, иначе как мне потом их на собеседованиях спрашивать.
1. Как используется тип unknown?
2. Что такое генерики?
3. Какая последняя новинки в TypeScript вам больше всего понравилась и почему?
4. Чем ключевое слово type отличается от interface?
5. Когда и как используется тип never?
6. Что такое директивы в typescript? Какие и зачем вы используете?
7. Расскажите о пространствах имен типов и пространстве имен переменных на примере выражения class User implements Person {...
8. Как используется tsconfig.json?
9. Что такое guard и как они используются?
10. Как вы дебажите typescript код?
В ходе собеседования я не только задаю вопросы, но и отправляю примеры кода для обсуждения. Для этого лучше всего подходит share на TypeScript Playground. Вот пример.
#typescript
Сегодня поделюсь подборкой моих вопросов для интервью по TypeScript. Естественно без ответов, иначе как мне потом их на собеседованиях спрашивать.
1. Как используется тип unknown?
2. Что такое генерики?
3. Какая последняя новинки в TypeScript вам больше всего понравилась и почему?
4. Чем ключевое слово type отличается от interface?
5. Когда и как используется тип never?
6. Что такое директивы в typescript? Какие и зачем вы используете?
7. Расскажите о пространствах имен типов и пространстве имен переменных на примере выражения class User implements Person {...
8. Как используется tsconfig.json?
9. Что такое guard и как они используются?
10. Как вы дебажите typescript код?
В ходе собеседования я не только задаю вопросы, но и отправляю примеры кода для обсуждения. Для этого лучше всего подходит share на TypeScript Playground. Вот пример.
Как TC39 предложения внедряются в TypeScript?
#typescript
В Node.js v16 появились новые фичи. Одна из них Array.at. К сожалению, использовать ее в TypeScript проектах еще нельзя.
TC39 выделяет такие stages для предложений:
🤷🏻 Stage 0: Strawperson.
💡 Stage 1: Proposal.
✍🏻 Stage 2: Draft.
📝 Stage 3: Candidate.
✅ Stage 4: Finished.
Подробней тут.
Так вот TypeScript внедряет фичи только на стадии Stage 3. Это не быстрый процесс, так как необходимо не только добавить описание в базовые d.ts файлы, но и сделать транспайлинг в ECMAScript версии не поддерживающий данную фичу. По-сути сделать функционал аналогичный babel плагинам.
К сожалению, Array.at перенесли из релиза 4.5 в 4.6.
⚠️Транспайлинг в старые версии идет только для синтаксических конструкций, как пример sync/await. Для новых методов в старых версиях ECMAScript необходимо подключать полифилы (смотри ts-polyfill или core-js). Спасибо Илье за вопросы в комментариях.
Рецепты по теме:
– Обзор Node.js v16: Новые JavaScript конструкции
#typescript
В Node.js v16 появились новые фичи. Одна из них Array.at. К сожалению, использовать ее в TypeScript проектах еще нельзя.
TC39 выделяет такие stages для предложений:
🤷🏻 Stage 0: Strawperson.
💡 Stage 1: Proposal.
✍🏻 Stage 2: Draft.
📝 Stage 3: Candidate.
✅ Stage 4: Finished.
Подробней тут.
Так вот TypeScript внедряет фичи только на стадии Stage 3. Это не быстрый процесс, так как необходимо не только добавить описание в базовые d.ts файлы, но и сделать транспайлинг в ECMAScript версии не поддерживающий данную фичу. По-сути сделать функционал аналогичный babel плагинам.
К сожалению, Array.at перенесли из релиза 4.5 в 4.6.
⚠️Транспайлинг в старые версии идет только для синтаксических конструкций, как пример sync/await. Для новых методов в старых версиях ECMAScript необходимо подключать полифилы (смотри ts-polyfill или core-js). Спасибо Илье за вопросы в комментариях.
Рецепты по теме:
– Обзор Node.js v16: Новые JavaScript конструкции
Advanced TypeScript Playlist by Basarat
#typescript #worth_seeing
Сегодня в рекомендациях не одно видео, а целый плейлист от Basarat. Вы знаете автора по книге TypeScript Deep Dive. В плейлисте собранны короткие видео уроки по продвинутому использованию typescript. Вот три видео, которые мне стоит пересказать как рецепты в рамках канала:
– TypeScript TYPES vs INTERFACES : Key Differences
– TARGET, LIB and POLYFILL for TypeScript and JavaScript
– TypeScript insane type: DeepReadonly
Ссылки:
👀Advanced TypeScript Playlist
📕TypeScript Deep Dive
#typescript #worth_seeing
Сегодня в рекомендациях не одно видео, а целый плейлист от Basarat. Вы знаете автора по книге TypeScript Deep Dive. В плейлисте собранны короткие видео уроки по продвинутому использованию typescript. Вот три видео, которые мне стоит пересказать как рецепты в рамках канала:
– TypeScript TYPES vs INTERFACES : Key Differences
– TARGET, LIB and POLYFILL for TypeScript and JavaScript
– TypeScript insane type: DeepReadonly
Ссылки:
👀Advanced TypeScript Playlist
📕TypeScript Deep Dive
Как использовать assert для улучшения читабельности кода?
#typescript
В javascript разработки мы обычно используем assert в коде тестов, но не в коде приложения. Мой опыт работы с koa читабельность кода с assert получается выше.
Пример из библиотеки koa:
Т.е. если пользователь не найден, будет выкинута ошибка с указанным текстом и статусом 401. Дальше по коду вы можете быть уверены, что
Причем TypeScript автоматически изменит тип выражения. Это достигается за счет использования Assertion Functions, который появились с версии 3.7. Пример такой функции:
К сожалению, Nest.js и Fastify из коробки не имеют встроенного assert, поэтому приходиться писать свой маленький хелпер. Оставлю его вам на самостоятельную реализацию.
#typescript
В javascript разработки мы обычно используем assert в коде тестов, но не в коде приложения. Мой опыт работы с koa читабельность кода с assert получается выше.
Пример из библиотеки koa:
ctx.assert(ctx.state.user, 401, 'User not found. Please login!');
Т.е. если пользователь не найден, будет выкинута ошибка с указанным текстом и статусом 401. Дальше по коду вы можете быть уверены, что
ctx.state.user
определен. Для этого используется пакет http-assert. Причем TypeScript автоматически изменит тип выражения. Это достигается за счет использования Assertion Functions, который появились с версии 3.7. Пример такой функции:
function assertIsString(val: any): asserts val is string {
if (typeof val !== "string") {
throw new AssertionError("Not a string!");
}
}
К сожалению, Nest.js и Fastify из коробки не имеют встроенного assert, поэтому приходиться писать свой маленький хелпер. Оставлю его вам на самостоятельную реализацию.
Подборка книг для изучения TypeScript
#list #typescript
В сегодняшней подборке все книги на английском языке. Читайте на английском. Это позволит вам изучать устоявшуюся терминологию. Вы ведь не ходите называть Promise Обещанием, а Tuple Кортежем?
📕The TypeScript Handbook. В марте 2021 команда переписала руководство и держит его актуальным после каждого релиза. Поэтому обучение начинайте именно с него. Книгу можно скачать бесплатно, в конце странице
📕Effective TypeScript. Книга от O'Reilly в формате принципов языка с объяснением почему стоит делать именно так. Например:
📕Programming TypeScript by Boris Cherny. Еще одна книга от O'Reilly с фокусом на реальной практике применения. Каждая глава заканчивается упражнениями для закрепления теории.
📕TypeScript 4 Design Patterns and Best Practices Свежая книга, которая не только показывает фичи языка, но и паттерны их использования.
#list #typescript
В сегодняшней подборке все книги на английском языке. Читайте на английском. Это позволит вам изучать устоявшуюся терминологию. Вы ведь не ходите называть Promise Обещанием, а Tuple Кортежем?
📕The TypeScript Handbook. В марте 2021 команда переписала руководство и держит его актуальным после каждого релиза. Поэтому обучение начинайте именно с него. Книгу можно скачать бесплатно, в конце странице
grab a copy in Epub or PDF form
.📕Effective TypeScript. Книга от O'Reilly в формате принципов языка с объяснением почему стоит делать именно так. Например:
Prefer Type Declarations to Type Assertions
📕Programming TypeScript by Boris Cherny. Еще одна книга от O'Reilly с фокусом на реальной практике применения. Каждая глава заканчивается упражнениями для закрепления теории.
📕TypeScript 4 Design Patterns and Best Practices Свежая книга, которая не только показывает фичи языка, но и паттерны их использования.
llhttp - new HTTP 1.1 parser for Node.js
#worth_seeing #typescript
На этой неделе в войс чате с Тимуром мы поднимали вопрос о системном программирование, т.е. создание инструментов для создания продуктов. Сегодняшний доклад как раз об этом.
В докладе Федор рассказывает как и зачем был переписан http_parser. Произошло это в 2019. Кодовая база
Ссылки:
👀 Видео
📕 Сайт
⚙️ GitHub
#worth_seeing #typescript
На этой неделе в войс чате с Тимуром мы поднимали вопрос о системном программирование, т.е. создание инструментов для создания продуктов. Сегодняшний доклад как раз об этом.
В докладе Федор рассказывает как и зачем был переписан http_parser. Произошло это в 2019. Кодовая база
http_parser
на чистом С перестала быть поддерживаемой. Ее переписали на С + TypeScript и назвали llparse
. Его исходный код стоит изучить с целью улучшения как своих навыков работы с TypeScript, так и понимания принципов работы http в целом.Ссылки:
👀 Видео
📕 Сайт
⚙️ GitHub
Навіщо потрібне infer у TypeScript
#typescript
Ключове слово
наприклад, так можна отримати тип першого аргументу функції:
Зверніть увагу, що описати це тільки через генерики неможливо.
#typescript
Ключове слово
infer
— це потужний інструмент, який дозволяє розгортати та зберігати типи під час роботи з чужим TypeScript кодом. Воно не може використовуватися без Conditional Types та поза пропозицією extends
. Infer
дозволяє визначити змінну в межах нашого обмеження, на яку буде посилатися або повертати.наприклад, так можна отримати тип першого аргументу функції:
type GetFirstArgumentOfAnyFunction<T> = T extends (
first: infer FirstArgument,
...args: any[]
) => any
? FirstArgument
: never
Зверніть увагу, що описати це тільки через генерики неможливо.
Як змінити модифікатор TypeScript?
#typescript
Версія TypeScript 2.8 додала можливість додавати або видаляти складовим типам модифікатори
Рецепти на тему:
- Як підтягнути TypeScript?
#typescript
Версія TypeScript 2.8 додала можливість додавати або видаляти складовим типам модифікатори
readonly
та ?
. Для цього використовують очевидні оператори +
і -
. Детальніше в документації. Приклад використання:interface ReadOnlyTodo {
readonly title: string
readonly description: string
readonly completed: boolean
}
type Mutable<T extends object> = {
-readonly [K in keyof T]: T[K]
}
type MutableTodo = Mutable<ReadOnlyTodo>
Рецепти на тему:
- Як підтягнути TypeScript?
Поділюся досвідом використання transform.tools. Частіше всього я використовую JSON To #TypeScript. Після трансформації можуть знадобитися правки, наприклад, додати enum. Приклади використання:
– додати інтерфейс події для Google Cloud Function. В ідеальному світі це вже повинно бути в SDK.
– описати інтерфейси запитів і відповідей для інтеграції зі стороннім API, у якому є текстова документація, але не специфікація. Якби була специфікація, наприклад Swagger, то правильно було б створити типи з неї.
Простий інструмент, який може заощадити час, тож про нього потрібно пам'ятати.
– додати інтерфейс події для Google Cloud Function. В ідеальному світі це вже повинно бути в SDK.
– описати інтерфейси запитів і відповідей для інтеграції зі стороннім API, у якому є текстова документація, але не специфікація. Якби була специфікація, наприклад Swagger, то правильно було б створити типи з неї.
Простий інструмент, який може заощадити час, тож про нього потрібно пам'ятати.
Як правильно налаштувати TypeScript?
#typescript
Більшість стартерів генерує неправильний
Є такий репозиторій tsconfig/bases. З нього генеруються пакети виду
Детальніше в репозиторії. Там, до речі, є і React.
#typescript
Більшість стартерів генерує неправильний
tsconfig.json
. Наприклад, після nest new project-name
необхідно правильно налаштувати compilerOptions.target
. ДетальнішеЄ такий репозиторій tsconfig/bases. З нього генеруються пакети виду
@tsconfig/node18
. Я рекомендую починати tsconfig.json
із "extends": "@tsconfig/node18/tsconfig.json"
і перевизначати тільки потрібні параметри. Для фанатів типізації можна використовувати @tsconfig/node18-strictest
Детальніше в репозиторії. Там, до речі, є і React.
Які tsconfig файли створювати?
#typescript
Ще один рецепт з налаштування TypeScript. З допомогою
У цьому проекті використовується 4 файли:
👉
👉
👉
👉
Кількість файлів буде залежить від вашого проекту та й використовуваних процесів. Просто пам'ятайте налаштування можна міняти в залежності від контексту запуску TypeScript.
#typescript
Ще один рецепт з налаштування TypeScript. З допомогою
--project
можна визначити який файл з налаштуваннями використовувати. Приклад із одного з моїх проектів."scripts": {
"build": "tsc --project tsconfig.build.json",
"test": "jest --config jest.config.ts",
"typecheck": "tsc --project tsconfig.json",
"watch": "tsc --project tsconfig.dev.json --watch"
},
У цьому проекті використовується 4 файли:
👉
tsconfig.json
успадковується від @tsconfig. Від нього успадковуються всі інші. Використовується для перевірки типів у команді typecheck.👉
tsconfig.build.json
використовується під час збирання Docker image. Тільки він має "noEmit": false
👉
tsconfig.dev.json
відключає правила, які зайві в процесі розробки або troubleshooting. Наприклад: "noUnusedLocals": false
👉
tsconfig.test.json
використовується для тестів. Саме його я вказую у jest.config.ts
Кількість файлів буде залежить від вашого проекту та й використовуваних процесів. Просто пам'ятайте налаштування можна міняти в залежності від контексту запуску TypeScript.
Правильний перехід на typescript v5
#typescript
На відміну від решти JavaScript екосистеми, TypeScript не слідує SemVer. Тобто немає різниці в переході між 4.8➡️4.9 та 4.9➡️5.0. В обох випадках можливі breaking changes.
Однак багато пакетів не використовують цю інформацію та в залежностях вказують, що очікують TypeScript@4.x. Приклад помилки під час install:
Помилки під час встановлення це не страшно. Ось важкоуловимі баги під час компіляції – це великі втрати часу на налагодження. Рецепт написаний за підсумком саме такого налагодження.
Обидва типи проблем легко вирішуються за допомогою npm overrides або yarn resolutions у package.json:
$typescript каже npm перевикористовувати вказану версію для всіх пакетів. Тепер ваш код використовуватиме потрібну версію тайпскрипту під час компіляції.
#typescript
На відміну від решти JavaScript екосистеми, TypeScript не слідує SemVer. Тобто немає різниці в переході між 4.8➡️4.9 та 4.9➡️5.0. В обох випадках можливі breaking changes.
Однак багато пакетів не використовують цю інформацію та в залежностях вказують, що очікують TypeScript@4.x. Приклад помилки під час install:
npm ERR! Could not resolve dependency:
npm ERR! peer typescript@"^3.7.5 || ^4.0.0" from eslint-plugin-deprecation@1.3.3
npm ERR! node_modules/eslint-plugin-deprecation
npm ERR! dev eslint-plugin-deprecation@"^1.3.3" from the root project
Помилки під час встановлення це не страшно. Ось важкоуловимі баги під час компіляції – це великі втрати часу на налагодження. Рецепт написаний за підсумком саме такого налагодження.
Обидва типи проблем легко вирішуються за допомогою npm overrides або yarn resolutions у package.json:
"typescript": "^5.0.2"
},
"overrides": {
"typescript": "$typescript"
}
$typescript каже npm перевикористовувати вказану версію для всіх пакетів. Тепер ваш код використовуватиме потрібну версію тайпскрипту під час компіляції.
Як швидко перейти на return await?
#eslint #typescript
Спочатку коротко розповім, навіщо це робити. Помилки в логах записуються у stack trace. Якщо функція повертає not resolved promise, то у stack trace буде дірка. Приклади коду та докладний розбір є у Node.js Best Practices 2.12 Always await promises before returning to avoid a partial stacktrace
Минулого тижня я занурився у debugging. Проблема була замаскована обірваними stack trace. Виявляється, що позбутися цього можна дуже швидко. Достатньо додативідсутності транзакцій на рівні бази даних . Так що додайте це правило до вашого проекту, щоб наступне налагодження пройшло швидше.
#eslint #typescript
Спочатку коротко розповім, навіщо це робити. Помилки в логах записуються у stack trace. Якщо функція повертає not resolved promise, то у stack trace буде дірка. Приклади коду та докладний розбір є у Node.js Best Practices 2.12 Always await promises before returning to avoid a partial stacktrace
Минулого тижня я занурився у debugging. Проблема була замаскована обірваними stack trace. Виявляється, що позбутися цього можна дуже швидко. Достатньо додати
@typescript-eslint/return-await
. Він має автофікс! Після eslint --fix
дебаг втратив детективний сюжет, бо стало очевидним, що проблема у #typescript
На вихідних вийшла нова версія VSCode розширення
👉 підсвічування синтаксису для типів у повідомленнях про помилки
👉 кнопка, яка відкриває оголошення відповідного типу поруч з типом у повідомленні про помилку.
👉 кнопка, яка відкриває помилку на typescript.tv
👉 кнопка, яка відкриває помилку на ts-error-translator
Якщо ви ще не користуєтеся цим розширенням, рекомендую встановити.
Автор просить підтримати лайками додавання до VSCode необхідного API. Якщо ви віддаєте перевагу WebStorm, то ставте лайк JetBrains support. Будь ласка, ⚠️використовуйте лайк, а не коментарі⚠️ – це дозволить робити правильні метрики без спам сповіщень через коментар.
Посилання
🔗 source code
🔗 VSCode marketplace
🔗 upvotes to move forward
На вихідних вийшла нова версія VSCode розширення
pretty-ts-errors
. Воно додає до вашого редактора:👉 підсвічування синтаксису для типів у повідомленнях про помилки
👉 кнопка, яка відкриває оголошення відповідного типу поруч з типом у повідомленні про помилку.
👉 кнопка, яка відкриває помилку на typescript.tv
👉 кнопка, яка відкриває помилку на ts-error-translator
Якщо ви ще не користуєтеся цим розширенням, рекомендую встановити.
pretty-ts-errors
дуже спрощує роботу джунів та їх менторів. Автор просить підтримати лайками додавання до VSCode необхідного API. Якщо ви віддаєте перевагу WebStorm, то ставте лайк JetBrains support. Будь ласка, ⚠️використовуйте лайк, а не коментарі⚠️ – це дозволить робити правильні метрики без спам сповіщень через коментар.
Посилання
🔗 source code
🔗 VSCode marketplace
🔗 upvotes to move forward
Як забезпечити іммутабельність у вашому коді?
#typescript
⚠️Уточнення для новачків іммутабельності це незмінність даних.
У заголовок винесено одне з моїх улюблених питань для співбесід. Наведу найкращу-гіршу відповідь як я почув її в оригіналі: "TypeScript provides readonly, but it is only compile-time immutable protection. So I prefer to use Immutable.js for my codebase. I've also used Object.freeze()"
Поясню чим саме ця відповідь погана для продуктової розробки: у продуктовому коді розробник має повний контроль усіх етапів створення, зміни та знищення даних. Це не код бібліотеки або фреймворку, який невідомо, як буде запущений. Це код продукту, який буде працювати повільніше через використання Immutable.js або Object.freeze().
TypeScript має відмінний функціонал:
➡️ readonly у параметрах інтерфейсів
➡️ генерік Readonly, який особливо зручний для аргументів ваших функцій
➡️ as const під час оголошення змінних
Цей функціонал покриває всі потреби продуктового коду і не впливає на run time. Для консистентності використання цих фічів є @typescript-eslint/prefer-readonly-parameter-types. Так же можливо написати свої eslint правила, щоб команда не забувала про readonly в іммутабельних структурах даних, наприклад DTO.
Щось таке я хотів би почути на інтерв'ю на вищеназване запитання. Це та ще трохи критики, що readonly як і інші TypeScript конструкції роблять код багатослівним та схожим на Java.
#typescript
⚠️Уточнення для новачків іммутабельності це незмінність даних.
У заголовок винесено одне з моїх улюблених питань для співбесід. Наведу найкращу-гіршу відповідь як я почув її в оригіналі: "TypeScript provides readonly, but it is only compile-time immutable protection. So I prefer to use Immutable.js for my codebase. I've also used Object.freeze()"
Поясню чим саме ця відповідь погана для продуктової розробки: у продуктовому коді розробник має повний контроль усіх етапів створення, зміни та знищення даних. Це не код бібліотеки або фреймворку, який невідомо, як буде запущений. Це код продукту, який буде працювати повільніше через використання Immutable.js або Object.freeze().
TypeScript має відмінний функціонал:
➡️ readonly у параметрах інтерфейсів
➡️ генерік Readonly, який особливо зручний для аргументів ваших функцій
➡️ as const під час оголошення змінних
Цей функціонал покриває всі потреби продуктового коду і не впливає на run time. Для консистентності використання цих фічів є @typescript-eslint/prefer-readonly-parameter-types. Так же можливо написати свої eslint правила, щоб команда не забувала про readonly в іммутабельних структурах даних, наприклад DTO.
Щось таке я хотів би почути на інтерв'ю на вищеназване запитання. Це та ще трохи критики, що readonly як і інші TypeScript конструкції роблять код багатослівним та схожим на Java.