Ярлык определения функции из 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 г.