devstory

Variables dans ECMAScript

1- Qu'est-ce que Variable?

Une variable (variable) est un "endroit dans la mémoire" (Memory location) où un programme utilise pour stocker des valeurs. Le nom de la variable est nommée un identificateur ou identifiant (identifier).
Le nom de variable doit être suivi par un principe. Voici les principes pour donner un nom à une variable :
  1. Les noms de variables ne doivent pas être identiques aux mots-clés (keyword).​​​​​​​
  2. Les noms de variable peuvent contenir des alphabets ou des chiffres, mais ne doivent pas commencer par un chiffre.
  3. Les noms de variable ne peuvent pas contenir d'espaces (white space) ni de caractères spéciaux, à l'exception des caractères de soulignement (_) et dolar ($).

2- Déclarer variable

La déclaration de variable est nécessaire parce que vous l'avez fait avant de l'utiliser. La syntaxe ES5 utilise le mot de passe var pour déclarer une variable. La syntaxe ES6 ajoute 2 nouveaux mots de passe qui sont let & const pour déclarer une variable.
// Declare variables:
var a1;
console.log(a1); // undefined

var a2 = 100;
console.log(a2); // 100


var a3, a4;
var a5, a6 = 200;

console.log(a5); // undefined
console.log(a6); // 200

var a7= 100, a8 = 300;


let b1;
console.log(b1); // undefined

let b2 = "Hello";
console.log(b2); // Hello



const c = 100;
console.log(c); // 100

 

block

Un bloc (block) est un ensemble de commandes situé dans des "accolades ouvrantes et fermantes" (Curly brackets) { }.

let

Le mot de passe let est utilisé pour déclarer un bloc de code et la portée d'une variable (block scope), ca veut dire que cette variavle se sera rendue compte par le programme dans tel bloc père ou le bloc enfant, mais il est à noter que la variable ne se sera pas rendue par autres programme en dehors du bloc qui la définit.
if(true) {

   let a = 200;

   console.log(a); // 200
}    

// Program will ignore this statement:
console.log(a);
Si vous utilisez le mot de passe let pour définir deux variables avec le même nom, une variable est déclarée dans le bloc père; une est déclaré dans le bloc enfant, le programme la traitera comme deux variables différentes.
let i = 1000;
let j = 2000;

if(true)  {

   i = 100; // Assign new value to 'i'
   let j = 200; // A new variable (***)
   console.log("Test1: " + i + " : " + j); // Test1: 100 : 200

}

console.log("Test2: "+ i + " : " + j); // Test2: 100 : 2000

var

Le mot clé var déclare une variable dont la portée (scope) est plus large de celle de variable let. Elle s'est rendue par le programme intérieur du bloc qui la définit, dans des blocs enfants, même s'est rendue en dehors du bloc qui la déclare.
if(true) {

   var a = 200;

   console.log(a); // 200
}    

console.log(a); // 200
Si vous déclarez deux variables avec le même nom avec le mot clé var, une variable est déclaré dans le bloc père, une autre dans le bloc enfant, le programme considère que ces deux variables sont de même (Dans la même position du mémoire).
var i = 1000;
var j = 2000;

if(true)  {

   i = 100; // Assign new value
   var j = 200; // Assign new value
   console.log("Test1: " + i + " : " + j); // Test1: 100 : 200

}

console.log("Test2: "+ i + " : " + j); // Test2: 100 : 200
Les variables qui sont déclarées dans le mot clé var dans une fonction se sera uniquement rendu compte par le programme dans la même fonction. Elle ne se sera pas rendue compte en dehors de la fonction.
// A function
var test = function()  {
    var a = 200;

    console.log(a); // 200
}

// Call function.
test();

console.log(a); // Not work!!

const

Le mot clé const sert à déclarer un constant. Lorsque vous déclarez un constant, vous devez toujours attribuer une valeur à ce constant. Mais vous ne pouvez pas attribuer une nouvelle valeur à cette variable. Il est à noter que: Comme la variable let, la variable const contient la portée de bloc (block scope).
// Declare a constant with a value

const greeting = "Hello";

// Assign new value to 'greeting'
greeting = "Hi"; // ==> Error!!


// Declare a constant without a value
const i  ; // ==> Error!!
Une variable est déclaré avec le mot clé const, et elle sera un constant si vous ne pouvez pas l'attribuer une nouvelle valeur, mais elle n'est pas immuable (immutable), vous pouvez changer ses property.
Observez l'exemple ci-dessous: une variable est déclaré avec le mot clé const, dont la valeur est un objet avec plusieurs property. Vous pouvez attribuer de nouvelles valeurs pour ses property de cet objet.
// Declaring a constant is an object
const person = {
    name: "Clinton",
    gender : "Female"  
};

console.log(person.name); // Clinton

// Can assign new values to properties of const object.
person.name = "Trump";
person.gender = "Male";

console.log(person.name); // Trump


// ** Error! (Cannot assign new value to const variable).
person =  {
   name : "Trump";
}

+ const: Object.freeze()

La méthode Object.freeze() vous aide à geler (freeze) un objet. Vous ne pouvez pas changer ni attribuer une nouvelle valeur à ses property.
Object.freeze()
// Declaring a constant is an object
const person = {
    name: "Clinton",
    gender : "Female"   
};

console.log(person.name); // Clinton

Object.freeze(person); // Freeze object 'person'.

person.name = "Trump";

console.log(person.name); // Clinton
Peut-être que vous êtes intéressé

Voici des leçons en ligne à part du site web o7planning que nous recommandons. La liste comprend des leçons en ligne et celles en promo.