Les liens de la mer numérique
aria-label and aria-labelledby are exclusive. So they can be enforced for components in typescript:
type ToggleSwitchProps = {
name: string;
checked: boolean;
handleToggle: () => void;
size?: "sm" | "lg" | "base";
classNames?: string;
} & ({ ariaLabel: string; ariaLabelledBy: never } | { ariaLabel: never; ariaLabelledBy: string });
How typescript types can improve safety?
It is interesting as it avoids a typescript to javascript compilation.
It works with plain JS too.
How to parse a programming language with typescript: here a small but working example
A tuple: type PersonProps = [string, number]
A variadic tuple: type Foo<T extends unknown[]> = [string, ...T, number];
A variadic tuple with 2 types:
type Bar<
T extends unknown[],
U extends unknown[]
> = [...T, string, ...U];When you use satisfies, the value BEATS the type.
The value of the variables is taken into account instead of the type declared in semicolon.
Also colon annotations and satisfies are equally safe.
Also unlike satisfies and colon annotations, using ‘as’ annotations lets you lie to TypeScript.
To recap, we’ve got FOUR ways of assigning a type to a variable:
- colon annotations
satisfiesasannotations- not annotating and letting TS infer it
The rule of thumb is that you should only use satisfies in two specific situations:
- You want the EXACT type of the variable, not the WIDER type.
- The type is complex enough that you want to make sure you didn’t mess it up
The project does not seem to be maintained anymore though :/
A great project to get started with hexagons (for example, a map).
js/ts utils
A project to use a Result type. This particular type contains a result or an error.
Would be my first pick to use in a JS environment
The infer keyword only works within conditional types. It defines the type depending of another one.
Some use cases:
- extract type from promise
- extract function return type
- extract multiple candidates
A minimal and simple JSON schema. The syntax is actually easy 👍
Creational
Singleton
Type of object that can be instantiated once
In Typescript, just use a global object, so you don't have the boilerplate.
Prototype
Object.getPrototypeOf
Builder
Build object step by step through different methods instead of using many parameters
Factory
Determine which object to instantiate
Structural
Facade
Simplified to hide low-level details of a system
Proxy
Reactivity system of Vue :D
Replace an original object and do some side effects
Advantage: allow user to work with the proxy just like the original object but it can trigger side effects behind the scene.
Proxy are also used when there is a large object that would be expensive to duplicate in memory.
Behavioral
Iterator
Traverse through a collection of objects.
A pull based system.
An object with a next() method in javascript that returns a { done: boolean; value: T }.
Observer
Allow many objects to subscribe to events that are broadcast by another object.
A Subject where other objects subscribe to it and triggers their method when the subject notify
Mediator
In case of many to many relationships, one object is a coordinator between them.
Middlewares are an example of mediator.
State
What is the difference between state and strategy pattern?