ES6 – Les Template Strings

Les Template Strings

On peut directement utiliser les variables dans une template string si on les insère dans un placeholder qui s’écrit ${variable}
Les template strings utilisent le caractère back-tick (accent grave simple `) pour délimiter les chaînes de caractères.

Javascript

ES5


var chaine = "world";
var machaine = "Hello " + chaine; // => Hello world
console.log(machaine);

ES6


const nouvelleChaine = "Michel";
const maNouvelleChaine = `Hello ${nouvelleChaine}`; // => Hello Michel
console.log(maNouvelleChaine);

Jsfiddle

Publier 7 mai 2018 par Michel PIALLIER dans ES6 - Les Template Strings Commentaires fermés

Ecriture d’une fonction fléchée

Les fonctions fléchées offrent une syntaxe raccourcie des fonctions en utilisant la syntaxe =>.

Syntaxe



function appelleMoi(nom) {console.log(nom);}

const appelleMoi = function(nom) {console.log(nom);}

devient



const appelleMoi = (nom) => {console.log(nom);}

Pas d’argument



const appelleMoi = () => {console.log('Michel!');}

Un argument



const appelleMoi = nom => {console.log(nom);}

retour d’une seule valeur



const appelleMoi = nom => nom

équivalent à :



const appelleMoi = nom => {return nom;}

Jsfiddle

Publier 17 mai 2018 par Michel PIALLIER dans ES6 - Les fonctions fléchées Commentaires fermés

L’objet “Map”

L’objet Map représente un dictionnaire, autrement dit une carte de clés/valeurs.
L’ordre d’insertion des clés est mémorisé dans l’objet et les boucles sur les Map parcourent les clés dans cet ordre.
Exemple si on veut décrire les dirigeant d’un club

Position(clé)	Nom(valeur)
Président	M Dupont
Vice-Président	F Renard
Secrétaire	S joly

Javascript


let team = new Map();
team.set("Président", "M Dupont");
team.set("Vice-Président", "F Renard");
team.set("Secrétaire", "S Joly");

// Autre écriture
// Le Map() constructor
let family = new Map([
['mother', 'Joan'],
['father', 'Rick'],
['brother', 'Brett'],
['sister-in-law', 'Kerry'],
['cousin', 'Joyce']    
]);

Jsfiddle

Publier 25 juin 2019 par sm2017 dans ES6 - DIvers Commentaires fermés

« Previous 1 2 3