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