La portée des variables et le “Hoisting”
VAR
Les variables typées var :
- ont une portée limitée seulement dans le cadre d’une fonction (ce n’est pas le cas dans les blocks if,for,foreach…)
- si la fonction a accès au context extérieur via une variable (“closure”), celle ci peut être modifiée
var a = 'World' var a = function (){ console.log('Hello') a = 'Buddy' var b = function (){ console.log(a) } return b() } a()
Sortie
Hello Buddy
Hoisting
Le Hoisting (ou hissage) élève la déclaration des variables tout en haut de l’execution de notre script.
En effet, Javascript n’est pas executé de la même manière qu’on l’écrit.
Dans l’exemple précédant, si on retourne b() avant de définir celle-ci une erreur apparait à l’execution :
var a = 'World' var a = function (){ console.log('Hello') a = 'Buddy' return b() var b = function (){ console.log(a) } } a()
Sortie
TypeError: b is not a function
En effet Javascript remanie le code en déclarant les variables en haut de la fonction (c’est l’action de Hoisting) :
var a a = 'World' a = function (){ var b //Declare b console.log('Hello') a = 'Buddy' return b() //Call b which is undefined at this step -> Error var b = function (){ console.log(a) } }
En revanche, si on n’assigne pas nos fonctions à des variables, javascript Hoist (hisse) la définition de la fonction :
function a (){ console.log('Hello') var a = 'Buddy' return b() function b (){ console.log(a) } } a()
devient …
function a (){ var a function b (){ console.log(a) } console.log('Hello') a = 'Buddy' return b() } a()