JSDoc и общие типы. Машинопись
В этой статье я объясню, как использовать Typescript с JSDoc, и покажу 2 способа создания общих типов в ваш код.
То, что я собираюсь показать, работает с модулем как ES5, так и ES6. Мой набор инструментов - VSCode в конфигурации по умолчанию без расширений.
Дженерики в JSDoc
Тег @template
определяет общий тип. Просто используйте его как обычный тип в нотации JSDoc:
Простая функция определяется , которая заключает аргумент в обещание . Определяется тип шаблона, который затем используется для описания как аргумента, так и возвращаемого типа.
Вот как линтер помогает нам с вызовом функции :
Как видите, тип значения результата изменяется на основе аргумента.
Машинопись с JSDoc
Вы когда-нибудь использовали MomentJS? Он имеет отличную систему набора текста. Введите соответствующие подсказки все над местом. Вот пример. Обратите внимание, как всплывающие подсказки справки с типами аргументов:
Это работает так, потому что исходный код MomentJS содержит типизированный файл с именем moment.d.ts , который определяет все типы и описывает аргументы функции с помощью Typescript синтаксис.
Попробуйте удалить файл определения из node_modules и локального кеша, и вы иметь грубое время на выяснение аргумента функции.
То же верно для любой популярной и сложной библиотеки.
Теперь давайте перейдем от MomentJS и реализуем аналогичный подход с помощью настраиваемого модуля. Скажем, нам нужно создать модуль, который содержит ранее показанную selfPromised()
функцию из приведенного выше примера.
Сначала создайте файл определения для модуля . имя модуля будет ./useless.js
. Файл определения: ./useless.d.ts
. Он описывает экспортированное значение модуля useless
.
Я показываю здесь простейший пример. Набор файла поддерживает все Машинописные функции.
Во-вторых, мы реализуем модуль:
Я использую здесь небольшую уловку. VSCode только ищет ввод файла с тем же именем, когда импорт произошел с require
или import
ключевых слов. Вы не получите никаких подсказок при внедрении модуля, если не используете этот трюк. Хитрость заключается в том, чтобы явно определить тип модуля, как я это сделал в первой строке. с помощью JSDoc нотации.
С помощью этого трюка вам не даже нужно имя набирать для файла то же way как модуль. Если у вас есть несколько модулей, для которых вы хотите создать набор файлов, вы можете определить их в один файл и разделите его с помощью функции пространства имен в Typescript. .
Вот полная реализация ./useless.js
.
Наконец, используйте модуль в других местах и возьмите преимущество типа подсказки:
Дженерики очень редко можно увидеть. В большинстве случаев я замечал их в популярных библиотеках. Хотя, если вы создаете взаимодействия сложного типа в повторно используемом коде, общий тип будет хороший подход, чтобы знать.
Другие мои статьи JSDoc: