Это много для распаковки, здесь построчно.
export default function
Ваше место по поводу этой строчки. Просто экспортирую функцию, чтобы сделать ее доступной где-нибудь в программе.
makeStyles<Theme = DefaultTheme, ClassKey extends string = string>
Здесь makeStyles - это имя функции.
То, что между <>, - это общие c аргументы что нужно. TypeScript Generics позволяет писать функции, которые могут принимать в качестве аргументов различные типы. Например:
function identity<T>(arg: T): T {
return arg;
}
Аргумент здесь arg: T, что означает, что arg должен иметь тип T, а возврат набирается с помощью (): T, эта секунда: T после закрывающей скобки указывает тип возвращаемого значения функции. Таким образом, аргумент и возвращаемый результат этой функции должны быть одного типа.
Итак, в нашем примере функция makeStyles принимает общий аргумент c Theme и ClassKey. Generics также позволяют вам указывать значения по умолчанию для этих аргументов, если они не переданы явно. Итак, где вы видите:
<Theme = DefaultTheme, ClassKey extends string = string>
Если значения не определены при вызове функции, тогда Theme будет type DefaultTheme, а ClassKey будет иметь тип string.
Другая часть состоит в том, что ClassKey расширяет строку. Это просто означает, что он наследует все строковые свойства своего типа.
Затем у нас есть сами аргументы:
(
style: Styles<Theme, {}, ClassKey>,
options?: Omit<WithStylesOptions<Theme>, 'withTheme'>
)
style - первый аргумент. Это тип Styles, который также является универсальным типом c, который принимает три аргумента. Вы можете найти интерфейс или тип стиля "Стили", чтобы увидеть, как это выглядит, чтобы получить больше разъяснений. Вот пример того, как это может выглядеть:
interface Styles<ThemeType, AppType, ClassKeyType> {
theme: ThemeType;
app: AppType;
classKey: ClassKeyType;
.... a bunch of other properties for the styles type.
}
С помощью Generics вы можете передавать различные типы, что делает вещи более гибкими. И компилятор машинописного текста достаточно умен, чтобы применять это в вашем коде в зависимости от того, как вещи были вызваны или созданы.
options - второй аргумент. Вы правы насчет знака?, Который означает, что это необязательный аргумент. Если он не передан, он просто не будет определен. Здесь мы используем специальный тип машинописного текста под названием Omit. Omit будет принимать тип в качестве первого аргумента и ключ этого типа в качестве второго аргумента. Он вернет новый тип, который имеет все свойства исходного типа, который вы передали в качестве первого аргумента, ЗА ИСКЛЮЧЕНИЕМ ключа, который вы передали в качестве второго аргумента.
Здесь WithStyleOptions - это еще один общий c типа, как и стили. Тема - это аргумент. Оттуда Omit возьмет этот тип и создаст новый тип, исключив свойство withTheme.
Тогда у нас есть:
: (props?: any) => ClassNameMap<ClassKey>;
Эта последняя часть вводит тип возвращаемого значения функции. . В этом случае эта функция вернет другую функцию.
Новая функция, которую она возвращает, будет принимать один аргумент с именем props, который будет иметь тип any. Любой в машинописном тексте означает то, что вы думаете, буквально может быть что угодно. Эта функция будет иметь возвращаемый тип ClassNameMap, который является еще одним обобщенным c.
Обязательно взгляните на все общие шаблоны, которые вы здесь используете, и посмотрите, как они определены. Это должно помочь. Также посмотрите, где вызывается функция makeStyle, я думаю, что увидеть ее с другой стороны тоже будет полезно.