ts-pattern: un packet pour émuler du Pattern Matching en Typescript

ts-pattern permet d’émuler un système de pattern matching en Typescript. Il est possible de match sur la forme d’un objet (les valeurs qu’il contient), de le destructurer, et de s’assurer que le match est exhaustif (ce qui veut dire qu’on a un pattern pour chaque possibilités).

Cette librairie permet aussi d’émuler des variants (des formes différentes d’un objet, mais associées au même Type) en utilisant un “tag” (ici le champ type).

import { match, P } from 'ts-pattern';

type Data =
  | { type: 'text'; content: string }
  | { type: 'img'; src: string };

type Result =
  | { type: 'ok'; data: Data }
  | { type: 'error'; error: Error };

const result: Result = ...;

const html = match(result)
  .with({ type: 'error' }, () => <p>Oups! An error occured</p>)
  .with({ type: 'ok', data: { type: 'text' } }, (res) => <p>{res.data.content}</p>)
  .with({ type: 'ok', data: { type: 'img', src: P.select() } }, (src) => <img src={src} />)
  .exhaustive();

L’article d’introduction écrit par l’auteur rentre plus dans les détails, en particulier l’intérêt des variants, une comparaison du pattern matching et d’autre flow-control (if/then/else, ternaires) :  Bringing Pattern Matching to TypeScript 🎨 Introducing TS-Pattern (anglais).

https://www.npmjs.com/package/ts-pattern

Nos derniers articles