Ярлык определения функции из Typescript
Эта статья актуальна для всех typescript
пользователей.
Хотя я еще не сталкивался с этой проблемой в Node.js
..
Если хотите, можете пропустить фоновую часть и сразу перейти к примерам кода.
Мотивация
Недавно я столкнулся с новой проблемой с typescript
в моем приложении react-redux
.
Один из фундаментальных принципов react-redux
- разделение задач.
В результате этого разделения нам может потребоваться передать множество параметров создателю действия.
Кроме того, нам может потребоваться использовать этот action creator
из разных components
.
До сих пор все звучит нормально.
Теперь добавим Typescript
.
Добавление typescript
в приложение react-redux
вынуждает нас определять каждую action creator
функцию, которую мы используем в нашем компоненте.
Конечно, некоторые функции могут быть определены как Function
тип, но есть много мест, где нам нужна полная подпись функции.
Этот шаблон может иногда расстраивать, особенно когда команда становится больше и все больше людей начинают прикасаться к коду.
Я и мой товарищ по команде Лидор Леви искали решение этой проблемы и нашли решение в этой проблеме Github.
TypeScript дает возможность наследовать параметры функции !!
Вот как мы это делаем
Определите свою функцию, где хотите
export const YOUR_FUNCTION_NAME = (
param1: number,
param2: Array<SOME_INTERFACE>,
param3: string,
param4: boolean
): YOUR_FUNCTION_TYPE => {
// some logic, or even keep empty
}
В определении вашего типа функции
YOUR_FUNCTION_NAME: (
...YOUR_FUNCTION_NAME_Params: Parameters<
typeof YOUR_FUNCTION_NAME
>
) => YOUR_FUNCTION_TYPE
Не забудьте
import
определение своей функции.
Теперь, когда вы используете эту функцию, typescript
будет знать типы параметров, и ваше автозавершение кода IDE может регулярно вам помогать.
Наслаждайтесь!
Первоначально опубликовано на https://dev.to 23 июня 2020 г.