Outils pour utilisateurs

Outils du site


web:javascript:typescript

TypeScript

Installation

  1. Installer node.js
  2. Installer TypeScript par npm : # npm install -g typescript

Linting

Il n'est plus recommendé d'utiliser TSLint, utiliser @typescript/eslint plutôt.
  • Visual Studio Code a une extension : TSLint
  • Linter Documentation : TSLint (Rules)

Pour installer:

$ npm i -g tslint

Fichier tslint.json de base :

{
    "extends": [
        "tslint:recommended"
    ],
    "rules": {
        
    }
}

Exemple de fichier tslint.json : tslint.json

Compilation / Transpile

En installant TypeScript, on installe un transpiler qui transforme le code TypeScript en JavaScript.

$ tsc fichier.ts

Avec le sourcemap:

$ tsc --sourceMap true fichier.ts

Types definitions

Souvent on peut retrouver les définitions de types avec les packages @types/*, où * est le nom du package original. Par exemple, pour boxen, on aura @types/boxen. Quand même vérifier avant d'installer n'importe quel package.

On peut aussi créer un fichier types.d.ts au niveau racine du projet. Dans ce fichier, on peut alors ajouter:

declare module "boxen";

Testing

On peut utiliser Jasmine.

$ npm install jasmine
$ jasmine init

Karma

Jest

Interface

interface ICat {
    name: string;
    age: number;
}
 
let fluffy: ICat;

On peut permettre d'ajouter n'importe quelle propriété en utilisant [prop]:

interface ICat {
    name: string;
    age: number;
    [prop: string]: any;
}
 
let fluffy: ICat = {
    name: "Fluffy",
    age: 2,
    eyeColor: "Brown"
};

On peut le faire pour des fonctions.

interface myFn {
    (n: number, m: number): number;
}

let addition: myFn;
addition = function(myNumber1: number, myNumber2: number): number {
    return myNumber1 + myNumber2;
}

TSLint semble plutôt privilégier cette syntaxe:

type IAdditionFn = (n: number, m: number) => number;

let addition: IAdditionFn;
addition = (myNumber1: number, myNumber2: number): number => {
    return myNumber1 + myNumber2;
};

Classes

class Cat implements ICat {
    private name: string;
    private color: string;
 
    constructor (name, color) {
        this.name = name;
        this.color = color;
    }
 
    speak() {
        console.log('meow');
    }
}

Peut être remplacé par :

class Cat implements ICat {   
    constructor (private name, private color) {
 
    }
 
    speak() {
        console.log('meow');
    }
}

Ressources

web/javascript/typescript.txt · Dernière modification : 2022/02/02 00:42 de 127.0.0.1