Niezrozumiały zapis typu generycznego w hooku

Niezrozumiały zapis typu generycznego w hooku
adams0
  • Rejestracja:prawie 8 lat
  • Ostatnio:7 dni
  • Postów:316
0

Cześć.
Wracam do Reacta po długiej przerwie i zauważyłem że jest coś w zapisie hooków na co nie natknąłem się wcześniej:

Kopiuj
const [fileList, setFileList] = useState<FileList | null>(null);

Czy możecie mi wyjaśnić jak się nazywa taki zapis i co to robi?

edytowany 1x, ostatnio: Riddle
Xarviel
  • Rejestracja:ponad 3 lata
  • Ostatnio:około 2 godziny
  • Postów:847
2

Jest to typ generyczny z TypeScript https://www.typescriptlang.org/docs/handbook/2/generics.html

Kopiuj
interface FileList {
  id: number;
  name: string;
  author?: string; 
}

// ...
// ...

const [file, setFileList] = useState<FileList | null>(null);

i teraz TypeScript oznaczył, że zmienna file, lub argument setFileList może być obiektem, lub nullem

Kopiuj
setFileList(null); // okej
setFileList({}); // błąd
setFileList({ id: 10 }); // błąd, bo brakuje właściwości name
setFileList({ id: 11, name: 'foo' }); // okej
setFileList({ id: 11, name: 'foo', author: 'bar' }); // okej, bo właściwość author jest dobrowolna i nie trzeba zawsze jej podawać

Podobne błędy pojawią się przy zmiennej file jeśli skorzystamy z niej w zły sposób.

edytowany 2x, ostatnio: Xarviel
Riddle
Administrator
  • Rejestracja:prawie 15 lat
  • Ostatnio:3 minuty
  • Lokalizacja:Laska, z Polski
  • Postów:10074
0
adams0 napisał(a):

Cześć.
Wracam do Reacta po długiej przerwie i zauważyłem że jest coś w zapisie hooków na co nie natknąłem się wcześniej:

Kopiuj
const [fileList, setFileList] = useState<FileList | null>(null);

Czy możecie mi wyjaśnić jak się nazywa taki zapis i co to robi?

To jest praktycznie to samo co:

Kopiuj
const [fileList, setFileList] = useState(null);
jarekr000000
  • Rejestracja:ponad 8 lat
  • Ostatnio:około 2 godziny
  • Lokalizacja:U krasnoludów - pod górą
  • Postów:4707
1

To coś FileList | null
to union type.
https://www.typescriptlang.org/docs/handbook/unions-and-intersections.html

FileList | null oznacza, że obiekt tego typu jest albo typu FileList albo typu null - gdzie typ null to singleton z jedną instancją null.


jeden i pół terabajta powinno wystarczyć każdemu
edytowany 1x, ostatnio: jarekr000000

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.