Plan du site  
pixel
pixel

Articles - Étudiants SUPINFO

Cours n°2 Introduction a typescript

Par Lucas ZIENTEK Publié le 11/01/2017 à 11:29:29 Noter cet article:
(0 votes)
Avis favorable du comité de lecture

Passer de javascript à typescript.

Cet article est un support de cours du laboratoire web supinfo paris. Il a été rédigé pour être donner avec un SCS ou SCT.

Que faut t'il connaitre pour suivre ce cours?

Les points très important :

  • La programation orienté objet

  • Le JS


Les nices to have :   

  • ES6 / ES7

  • Techno web

Le Typage

Les différents type

Les types de bases sont les même qu'en Javascript c'est à dire: 

  • number (entier, float, etc...)

  • string

  • boolean

  • any (qui est le type 'objet' JS)

Les variables

Pour typer une variable c'est très simple :

var maVariableNombre :number;

variable de type nombre

var maVariableString :string;

variable de type chaine de charactères

Les variables peuvent être typé implicitement à la déclaration:

var maVarNombre = 1;

 variable de type number
            

var maVarString = "hello world";

 variable de type string
            

var maVarAny = null;

 variable de type any
            

Vous savez maintenant typer des variables en typescript.

Les fonctions

Pour les fonctions c'est le même concept ":type" pour indiquer le type:

function triple(n: number): number { return 3 * n; }
                

Les classes

Comme dans javascript ES6 il y a la notion de class et d'interface dans typescript. Les notion d'heritage existe,le concept de public privé protected, en gros tout les grands principes

 écriture d'une classe :

class Lion extends Animal { // class Lion herite de Animal

  sex: string; // attribut

  constructor(name: string, sex: string) { // contructeur  
    super(name); // call constructeur de la class mère  
    this.sex = sex;  
  }  

  shout(): string { // une methode  
    return "Rooooaarrr!"  
  }  
}

//instanciation
var myLion = new Lion('pablo','female');

//call d'un methode
myLion.shout();

On voit donc comment déclarer une class avec héritage. Le fonctionnement est très proche de JS ES6 la grande différence se situe au niveau des attributs qui sont déclarés dans le corp de la class.

Les interfaces

La nuance avec la class est qu'on ne définit l'interieur des methodes:

interface I3 extends I2 {
 c: boolean; 
 f(truc :I2):string; 
}
                

Autre beauté du langage

Fonction anonymes

Il existe en typescript une facon plus reduite d'écrire une fonction anonyme (la version javascript rest toujours disponible). Cette nouvelle écriture permet d'amelioré la lisibilité du code et de réduire l'écriture.

function (a, b) { return a * b; } //fonction anonyme JS


(a, b) => a * b //fonction anonyme fléché

Typage anonyme

On peu en typescript créé des types anonyme lors de la déclaration d'une variable ou typer un d'une fonction de callback par exemple.

var monObjetAnonyme: { a: number, b: string, c: string[] };
            

Fonctionnalité similaire a ES6

  • L'utilisation de let et const.

  • Les Promises

  • le generator (yield et function*) en fonction de la version de translation utilisé

  • async, await sur les fonction / méthode avec ES7

A propos de SUPINFO | Contacts & adresses | Enseigner à SUPINFO | Presse | Conditions d'utilisation & Copyright | Respect de la vie privée | Investir
Logo de la société Cisco, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société IBM, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sun-Oracle, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Apple, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sybase, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Novell, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Intel, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Accenture, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société SAP, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Prometric, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Toeic, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo du IT Academy Program par Microsoft, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management

SUPINFO International University
Ecole d'Informatique - IT School
École Supérieure d'Informatique de Paris, leader en France
La Grande Ecole de l'informatique, du numérique et du management
Fondée en 1965, reconnue par l'État. Titre Bac+5 certifié au niveau I.
SUPINFO International University is globally operated by EDUCINVEST Belgium - Avenue Louise, 534 - 1050 Brussels