Passage en ES6 (2015) - mathalea/mathalea GitHub Wiki

EN COURS D'ÉCRITURE

jE VOUS INVITE À APPORTER VOTRE PIERRE À L'ÉDIFICE

Petit tuto pour mettre à jour son code JS https://www.w3schools.com/js/js_es6.asp

1.var -> let ou const

La portée (scope) d'une variable déclarée avec var est la totalité de la fonction où var est écrit. Cela peut poser des problèmes quand on souhaite réduire cette portée à des parties plus petites du code.

let et const résolvent ce problème en réduisant la portée au bloc où la déclaration a eu lieu.

De plus, const signifie que la variable ne peut pas être réaffectéé (à ne pas confondre avec immutable), alors que c'est l'inverse pour let. Bref, on utilise la plupart du temps const sauf quand la variable est réaffectée (VSCode vous l'indiquera dans l'onglet "PROBLEMS")

2.Arrow Functions

3.For/of

4.Map Objects

5.Set Objects

6.fonction constructeur -> Classes

export default function TypeExo() {
  Exercice.call(this) // Héritage de la classe Exercice()
  this.prop1 = ...
  ...
  this.nouvelleVersion = function () {...} // Comme cette fonction est déclarée comme n'importe quelle propriété, il ne s'Agit pas d'une méthode d'instance mais d'une propriété qui est une fonction. Cela peut poser des problèmes aux classes filles si on redéfinit nouvelleVersion comme méthode d'instance.
}

vers

export default class TypeExo extends Exercice {
    constructor () { //  Attention, ici on reprend les paramètres de la fonction constructeur, s'il y a des paramètres, il faut les répercuter ici bien sur
    super() // Appel du constructeur de la classe mère (Exercice)
    this.prop1 = 'a'
  }

  nouvelleVersion () {...} // Dernière chose, en sortant du constructeur la fonction nouvelleVersion, on obtient bien une méthode d'instance. Ce qui est équivalent à faire TypeExo.prototype.nouvelleVersion = function () {...}
}

Exemple avec des paramètres dans la fonction constructeur :

export default function TablesParametres (tablesParDefaut = '2-3-4-5-6-7-8-9') {
    this.titre = titre
    TablesDeMultiplications.call(this, tablesParDefaut)
    this.sup2 = 2
    this.tailleDiaporama = 3
  }

Cela donne avec une classe :

export default class TablesParametres extends TablesDeMultiplications {
  constructor (tablesParDefaut = '2-3-4-5-6-7-8-9') {
    super(tablesParDefaut)
    this.titre = titre
    this.sup2 = 2
    this.tailleDiaporama = 3
  }
}

7.Promises

8.Symbol

9.Default Parameters

10.Function Rest Parameter

11.String.includes()

12.String.startsWith()

13.String.endsWith()

14.Array.from()

15.Array keys()

16.Array find()

17.Array findIndex()

18.New Math Methods

19.New Number Properties

20.New Number Methods

21.New Global Methods

22.Iterables Object.entries

23.JavaScript Modules