HTML Diff
0 added 0 removed
Original 2026-01-01
Modified 2026-02-26
1 <p>В JavaScript при создании объектов мы можем использовать разные значения в качестве ключей. Среди значений могут быть строки, числа или символы. Ровно такие же возможности TypeScript предоставляет для своих объектных типов, с которыми мы научимся работать в этом уроке.</p>
1 <p>В JavaScript при создании объектов мы можем использовать разные значения в качестве ключей. Среди значений могут быть строки, числа или символы. Ровно такие же возможности TypeScript предоставляет для своих объектных типов, с которыми мы научимся работать в этом уроке.</p>
2 <p>В ходе курса мы уже работали с объектными типами и с интерфейсами, в которых имена полей заданы заранее. Давайте теперь познакомимся с синтаксисом для динамических ключей:</p>
2 <p>В ходе курса мы уже работали с объектными типами и с интерфейсами, в которых имена полей заданы заранее. Давайте теперь познакомимся с синтаксисом для динамических ключей:</p>
3 <p>Здесь мы объявили объектный тип dynamicKeysObject, в котором ключом может служить любой тип из доступных типов данных key: string | number | symbol. Попробуем указать такой тип для переменной:</p>
3 <p>Здесь мы объявили объектный тип dynamicKeysObject, в котором ключом может служить любой тип из доступных типов данных key: string | number | symbol. Попробуем указать такой тип для переменной:</p>
4 <p>Еще динамические ключи можно использовать совместно с указанными явно полями. Тогда ограничения динамических полей также будут распространяться и на них:</p>
4 <p>Еще динамические ключи можно использовать совместно с указанными явно полями. Тогда ограничения динамических полей также будут распространяться и на них:</p>
5 <p>В примере мы явно указали тип для поля palette, получили корректную проверку типа с помощью satisfies и при этом оставили достаточно свободы для дальнейшего расширения темы.</p>
5 <p>В примере мы явно указали тип для поля palette, получили корректную проверку типа с помощью satisfies и при этом оставили достаточно свободы для дальнейшего расширения темы.</p>
6 <p>Точно такой же синтаксис и поведение у динамических ключей в интерфейсах:</p>
6 <p>Точно такой же синтаксис и поведение у динамических ключей в интерфейсах:</p>
7 <p>В классах динамические ключи можно использовать для обычных и для static полей:</p>
7 <p>В классах динамические ключи можно использовать для обычных и для static полей:</p>
8 <h2>Template String Literal</h2>
8 <h2>Template String Literal</h2>
9 <p>Динамические ключи полезны там, где нам неизвестны все возможные имена полей объекта, но мы все равно хотим ограничить их тип. В TypeScript тип ключа может также быть и шаблонным литералом. Для примера попробуем объявить тип слушателя и потребовать, чтобы все его методы начинались со слова on:</p>
9 <p>Динамические ключи полезны там, где нам неизвестны все возможные имена полей объекта, но мы все равно хотим ограничить их тип. В TypeScript тип ключа может также быть и шаблонным литералом. Для примера попробуем объявить тип слушателя и потребовать, чтобы все его методы начинались со слова on:</p>
10 <p>Литеральный тип on${string} нам говорит, что мы ожидаем строку по шаблону "строка начинается с on, а дальше идет любая строка". Такая техника называется<em>Template String Literal</em>, она помогает наложить ограничения при типизации строк.</p>
10 <p>Литеральный тип on${string} нам говорит, что мы ожидаем строку по шаблону "строка начинается с on, а дальше идет любая строка". Такая техника называется<em>Template String Literal</em>, она помогает наложить ограничения при типизации строк.</p>
11 <p>В типичном веб-приложении структура большинства объектов нам известна изначально. Потому использование динамических ключей чаще можно увидеть в библиотеках и вспомогательных функциях, которые мы и рассмотрим в следующих уроках.</p>
11 <p>В типичном веб-приложении структура большинства объектов нам известна изначально. Потому использование динамических ключей чаще можно увидеть в библиотеках и вспомогательных функциях, которые мы и рассмотрим в следующих уроках.</p>