typescript, react и интерфейсы - организовать правильную структуру
использую связку react и typescript
описываю разные типы (состояния компонент react, элементы массивов и т.д.) в качестве интерфейсов, которые затем использую в коде
подскажите такие технические вопросы (сам с этим только сейчас стал сталкиваться и хотелось бы сразу понять какой подход более правильный):
если интерфейс используется только в одном компоненте react, стоит ли его всё выносить в отдельный файл
стоит ли логически связанные интерфейсы выносить в отдельный файл или все интерфейсы хранить в одном файле
как правильно выносить интерфейсы в отдельный файл - ведь для них тоже наверное
exportнадо будет прописывать, а потом приimportуказывать, какой интерфейс требуется - или это не обязательно?
Ответы (1 шт):
Берём твой вопрос, заменяем термин интерфейс на абстрактный класс.
Теперь тебе вопрос.
Будешь ли ты выносит в отдельный файл abstract class A если:
- в этом же файле он расширяется классом B?
- в двух/трех/... других файлах он расширяется классами B/C/...?
- ты вообще уверен что обязан в JavaScript плодить по файлу на конструктор?
style guide
возьмём для примера
An unofficial TypeScript Style Guide
от Basarat - четырежды MVP
раздел interface
Don't prefix with
I
говорит он.
С чем, лично я, не согласен. Использование префикса в интерфейсах и типах, например $, может реально облегчить жизнь.
OOP (IMHO)
Читая умные книжки больших дядек - помни, что ООП это решение проблем с которыми ОНИ столкнулись в рамках их
- языка
- средств сборки
- проблем с памятью
- и т.д. и т.п.
-,- подведу итог
Если ты импортируешь только типы - используй это
import type {} from 'someModule'
Важно: declaration-merging !!!!
Если interface class namespace объединяются в одну сущность - однозначно, они должны быть в одном файле.
export class Album {
label: Album.AlbumLabel;
}
export namespace Album {
export class AlbumLabel {}
}
export interface Fish {
fly(): void
}
export abstract class Fish {
}
Ответы из "опросника"
- Ты же Используешь
.tsx? Да !!!?
Пфф, конечно же нет!
"все интерфейсы хранить в одном файле" - а чо они вообще забыли в отдельном файле? Помни - интерфейс это просто комментарий, расширенная версия JSDoc. Их стоит выносить в отдельный файл, мм..., как функции, только в том случае, если они используются в разных местах проекта.
-
ведь для них тоже наверное export надо будет прописывать
По моему мнению - очевидно, что с такими вопросами мы тебя отправим читать документацию и учить язык... Не забудь почитать про
import type {} from 'someModule'