Discussion :

[St�phane le calme]

TypeScript 2.4 est disponible en Release Candidate
et s'accompagne des expressions d'importation dynamique

Expressions d'importation dynamique

TypeScript 2.4 prend en charge les appels new Import () de ECMAScript. Ces appels importent un module et renvoient un Promise (une classe dont la motivation principale est d'apporter la gestion des erreurs de style synchrone au code de style Async / Callback.) � ce module.

Par exemple, imaginez une page Web qui vous permet de cr�er et d'�diter des images. Lorsque vous travaillez avec un fichier, la page vous permettra de t�l�charger imm�diatement ce fichier. Mais si vous travaillez sur plusieurs images, vous pouvez les enregistrer en tant que fichier .zip.

Vous pourriez avoir une biblioth�que d'utilit� pour cr�er un fichier zip, mais comme le t�l�chargement de plusieurs fichiers n'est pas si courant, vous voudrez charger cette fonctionnalit� paresseusement. Les expressions import () vous permettent de charger un module � la vol�e en tant que Promise comme suit

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
async function getZipFile(name: string, files: File[]): Promise<File> {
    const zipUtil = await import('./utils/create-zip-file');
    const zipContents = await zipUtil.getContentAsBlob(files);
    return new File(zipContents, name);
}

Microsoft assure que cette fonctionnalit� peut s�av�rer incroyablement utile dans les situations o� vous souhaitez importer des modules conditionnellement. Les projets qui utilisent des groupes comme Webpack peuvent fonctionner sur ces appels import () et diviser le code en petits paquets qui peuvent �tre charg�s en peu de temps.

Ce que tout cela signifie est que :

• vous pouvez envoyer moins de JS sur le fil pour des sc�narios plus courants ;
• vos utilisateurs peuvent obtenir des temps de chargement de page plus rapides pour du contenu critique.

Une v�rification de param�tres de rappel plus s�r

Lorsque vous v�rifiez si deux fonctions sont assignables l'une � l'autre, TypeScript v�rifie si leurs param�tres sont bidirectionnellement assignables : Microsoft l�appelle bivariance de param�tres de fonction. Il y a plusieurs raisons � cela, mais elles d�coulent principalement du caract�re structurel de TypeScript et de la fa�on dont Microsoft a essay� de faire correspondre l'intuition des gens.

D�apr�s son exp�rience, les utilisateurs ne se heurtent g�n�ralement pas � des probl�mes avec tout cela. Cependant, Microsoft a observ� que ce mod�le s'effondre face � des conteneurs qui ont transmis des donn�es internes via des rappels � en particulier des Promises. Par exemple, Promise <Animal> �tait assignable � Promise <Chien>, ce qui est incorrect. Vous pouvez voir un comportement similaire dans l'exemple suivant :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
interface Animal { animalStuff: any }
interface Dog extends Animal { bark(): void }
 
interface BasicCollection<T> {
    forEach(callback: (value: T) => void): void;
}
 
declare let animalCollection: BasicCollection<Animal>;
declare let dogCollection: BasicCollection<Dog>;
 
// Ceci devrait être une erreur, mais jusqu’à TypeScript 2.3, le langage le permet
.
dogCollection = animalCollection;

Pour r�soudre ce probl�me, TypeScript 2.4 resserre d�sormais les choses et compare les param�tres qui sont notamment les rappels. Lors de la v�rification des rappels, TypeScript sera strict quant � la v�rification des param�tres de fa�on contravariante par rapport � la v�rification actuelle. La bivarit� des param�tres s'applique toujours autrement, mais Microsoft a constat� que c'�tait une v�rification de s�curit� efficace sans changer radicalement le syst�me de type.

Types faibles

Dans TypeScript 1.6, Microsoft avait ajout� une v�rification des propri�t�s exc�dentaires dans les litt�raux d'objets. Cette v�rification a cherch� des propri�t�s inattendues dans les litt�raux d'objets, et il est arriv� qu�elle attrape une grande classe de bogues. La seule lacune du contr�le �tait que si vous n'avez pas imm�diatement transmis votre objet litt�raire � quelque chose du type appropri�, le contr�le ne serait pas d�clench�.

Dans TypeScript 2.4, Microsoft ajoute une v�rification similaire pour ce qu�elle appelle les types faibles. Tout type qui contient uniquement des propri�t�s facultatives est consid�r� comme un type faible puisqu'il offre peu de restrictions sur ce qui peut lui �tre attribu�. Par exemple, ce type d'options est un type faible :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
interface Options {
    data?: string,
    timeout?: number,
    maxRetries?: number,
}

Dans TypeScript 2.4, il est maintenant une erreur d'attribuer n'importe quoi � un type faible lorsqu'il n'y a pas de chevauchement dans les propri�t�s. Par exemple :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
function sendMessage(options: Options) {
    // ...
}
 
const opts = {
    payload: "hello world!",
    retryOnFail: true,
}
 
// Error!
sendMessage(opts);
// No overlap between the type of 'opts' and 'Options' itself.
// Maybe we meant to use 'data'/'maxRetries' instead of 'payload'/'retryOnFail'

�tant donn� qu'il s'agit d'un changement qui peut provoquer une rupture, vous devrez peut-�tre conna�tre les solutions de rechange identiques � celles des contr�les stricts de l'objet :

D�clarez les propri�t�s si elles existent r�ellement.
Ajoutez une signature d'index au type faible (c'est-�-dire [propName: string]: {}).
Utilisez une assertion de type (c'est-�-dire opts as Options).

Source : Microsoft

[St�phane le calme]

Microsoft annonce la disponibilit� de TypeScript 2.4
qui apporte une v�rification plus stricte des param�tres de retour

Expressions dynamiques import ()

Les expressions d'importation dynamique sont une nouvelle fonctionnalit� dans ECMAScript qui vous permet de demander de mani�re asynchrone un module � n'importe quel point arbitraire dans votre programme. Ces modules reviennent en tant que Promises (transformation d'une fonction asynchrone en un objet � au sens JavaScript du terme � afin de faciliter la manipulation de ladite fonction asynchrone) du module lui-m�me, et peuvent �tre en mode await dans une fonction asynchrone, ou peuvent recevoir un rappel avec .then.

Ce que cela signifie, en bref, est que vous pouvez importer de fa�on conditionnelle et paresseuse d'autres modules et biblioth�ques pour rendre votre application plus efficace et plus soucieuse des ressources. Par exemple, voici une fonction async qui n'importe qu'une biblioth�que d'utilitaires lorsqu'elle est n�cessaire :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
async function getZipFile(name: string, files: File[]): Promise<File> {
    const zipUtil = await import('./utils/create-zip-file');
    const zipContents = await zipUtil.getAsBlob(files);
    return new File(zipContents, name);
}

Microsoft indique que nombreux sont les bundlers qui disposent d�un support pour diviser automatiquement les lots de sortie (ou encore le � fractionnement de code �) en fonction de ces expressions import (), alors les ing�nieurs proposent d�envisager d'utiliser cette nouvelle fonctionnalit� avec la cible module esnext. Notez que cette fonctionnalit� ne sera pas effective avec la cible module es2015, car la fonctionnalit� est pr�vue pour ES2018 ou une version ult�rieure.

�num�ration de cha�nes de caract�res

Cela fait d�j� un moment que TypeScript dispose des types de cha�nes litt�rales, et d�enums depuis sa sortie. Ayant eu le temps de voir comment ces fonctionnalit�s �taient utilis�es, les ing�nieurs ont modifi� les �num�rations dans TypeScript 2.4 pour voir comment ils pourraient travailler ensemble. Cette version de TypeScript permet maintenant aux membres d'�num�ration de contenir des initialiseurs de cha�nes.

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
enum Colors {
    Red = "RED",
    Green = "GREEN",
    Blue = "BLUE",
}

Les �num�rations de cha�nes de caract�res ont l'avantage d��tre beaucoup plus faciles � d�boguer et peuvent �galement d�crire les syst�mes existants qui utilisent des cha�nes. Comme les �num�rations num�riques et les types litt�raires, ces �num�rations peuvent �galement �tre utilis�es comme �tiquettes dans des unions discrimin�es.

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
enum ShapeKind {
    Circle = "circle",
    Square = "square"
}
 
interface Circle {
    kind: ShapeKind.Circle;
    radius: number;
}
 
interface Square {
    kind: ShapeKind.Square;
    sideLength: number;
}
 
type Shape = Circle | Square;

V�rification am�lior�e des g�n�riques

TypeScript 2.4 comporte des am�liorations dans la fa�on dont les types sont d�duits lorsque les g�n�riques entrent en jeu, ainsi qu'une v�rification am�lior�e lors de la relation entre deux types de fonctions g�n�riques.

Types de retour comme cibles d'inf�rence

TypeScript peut d�sormais permettre aux types de fluctuer � travers les types de retour dans certains contextes. Cela signifie que vous pouvez d�cider plus facilement o� placer vos types. Par exemple :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
function arrayMap<T, U>(f: (x: T) => U): (a: T[]) => U[] {
    return a => a.map(f);
}
 
const lengths: (a: string[]) => number[] = arrayMap(s => s.length);

Il arrivait que "s" ait besoin d'�tre explicitement annot� ou son type aurait �t� d�duit comme {}. Bien que les longueurs puissent �tre laiss�es sans description dans ce cas, il a �t� surprenant pour certains utilisateurs que l'information de ce type n'ait pas �t� utilis�e pour d�duire le type de s.

Dans TypeScript 2.4, le syst�me de type sait que "s" est une cha�ne du type de longueurs, ce qui pourrait mieux r�pondre � vos choix stylistiques.

Cela signifie �galement que certaines erreurs seront d�tect�es, puisque TypeScript peut trouver de meilleurs candidats que le type {} par d�faut (ce qui est souvent trop permissif).

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
let x: Promise<string> = new Promise(resolve => {
    resolve(10);
    //      ~~ Now correctly errors!
});

V�rification plus stricte des fonctions g�n�riques

TypeScript essaie maintenant d'unifier les param�tres de type lors de la comparaison de deux types de signature unique. En cons�quence, vous obtiendrez des contr�les plus stricts lors de la relation entre deux signatures g�n�riques qui peuvent d�tecter certains bogues.

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
type A = <T, U>(x: T, y: U) => [T, U];
type B = <S>(x: S, y: S) => [S, S];
 
function f(a: A, b: B) {
    a = b;  // Error
    b = a;  // Ok
}

Une v�rification de param�tres de rappel plus s�r

Lorsque vous v�rifiez si deux fonctions sont assignables l'une � l'autre, TypeScript v�rifie si leurs param�tres sont bidirectionnellement assignables : Microsoft l�appelle bivariance de param�tres de fonction. Il y a plusieurs raisons � cela, mais elles d�coulent principalement du caract�re structurel de TypeScript et de la fa�on dont Microsoft a essay� de faire correspondre l'intuition des gens.

D�apr�s son exp�rience, les utilisateurs ne se heurtent g�n�ralement pas � des probl�mes avec tout cela. Cependant, Microsoft a observ� que ce mod�le s'effondre face � des conteneurs qui ont transmis des donn�es internes via des rappels � en particulier des Promises. Par exemple, Promise <Animal> �tait assignable � Promise <Chien>, ce qui est incorrect. Vous pouvez voir un comportement similaire dans l'exemple suivant :

Code TypeScript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
interface Animal { animalStuff: any }
interface Dog extends Animal { bark(): void }
 
interface BasicCollection<T> {
    forEach(callback: (value: T) => void): void;
}
 
declare let animalCollection: BasicCollection<Animal>;
declare let dogCollection: BasicCollection<Dog>;
 
// Ceci devrait être une erreur, mais jusqu’à TypeScript 2.3, le langage le permet
.
dogCollection = animalCollection;

Pour r�soudre ce probl�me, TypeScript 2.4 resserre d�sormais les choses et compare les param�tres qui sont notamment les rappels. Lors de la v�rification des rappels, TypeScript sera strict quant � la v�rification des param�tres de fa�on contravariante par rapport � la v�rification actuelle. La bivarit� des param�tres s'applique toujours autrement, mais Microsoft a constat� que c'�tait une v�rification de s�curit� efficace sans changer radicalement le syst�me de type.

Source : Microsoft

Et vous ?

Quelles fonctionnalit�s vous int�ressent le plus ?

Voir aussi :

Comprendre les Promises en JavaScript / TypeScript, article de yahiko
TypeScript entre dans le top 20 des langages les plus populaires, d'apr�s le classement Redmonk de juin 2017
Apr�s avoir r��crit Angular en TypeScript, Google approuve le surensemble JavaScript de Microsoft pour ses d�veloppements internes