

TTT (TypeScript Tips and Tricks)


Sylvain DEDIEU
Frontend engineer – #ui-foundations
Agenda
1
2
3
Type manipulation
Type affectation
Modern Javascript hidden features

s.dedieu@criteo.com



Sylvain DEDIEU
Frontend engineer – #ui-foundation
s.dedieu@criteo.com
s.dedieu@criteo.com


Type Manipulation

Intersection
interface ErrorHandling {
success: boolean;
error?: { message: string };
}
interface ArtworksData {
artworks: { title: string }[];
}
interface ArtistsData {
artists: { name: string }[];
}
// These interfaces are composed to have
// consistent error handling, and their own data.
type ArtworksResponse = ArtworksData & ErrorHandling;
type ArtistsResponse = ArtistsData & ErrorHandling;Example of a Typescript Type intersectionUnion
Generic
Partial
Pick
Omit
Extract
Mapped
Type Affectation

Standard
As
Satisfies
Modern Javascript hidden features

Spread syntax mastering (1/3)
Spread syntax mastering (2/3)
Spread syntax mastering (3/3)
StructuredClone
The Map Object (1/3)
The Map Object (2/3)
The Map Object (3/3)
Playing with URLs
Image lazy-loading
TTT (Type
By Dedieu Sylvain
TTT (Type
- 128