Informatique


La portée des variables

Aller à

Wablief?

La portée d'une variable indique où une variable sera visible et donc accessible par les instructions du programme et de ses fonctions, la portée est globale ou locale.
La portée est descendante.


La portée des variables est soit:

  • globale: ces variables sont accessibles partout dans le programme et les fonctions
  • locale: ces variables sont accessibles au sein du bloc d'instructions où elles ont été déclarées et au sein des blocs d'instructions imbriqués (portée descendante).

À la fin d'un bloc d'instructions autre que celui d'une fonction, toutes les variables locales déclarées avec const et let son détruites.
Celles déclarées avec var ne sont pas détruites et persistent après l'exécution du bloc.

Démo
	<script>
	if(true){
		let p1="Pierre";
		const p2="Paul";
		var p3="Jacques";
		document.write("Les prohètes "+p1+" "+p2+" "+p3+"<br>");
	}
	document.write(p3);
	document.write(p1);
	document.write(p2);
	</script>

À la fin d'un bloc d'instructions appartenant à une fonction, toutes les variables locales déclarées en tant que paramètre ou var, let et const son détruites.

Démo
	<script>
	function sacre(p1){
		let p2="Pierre";
		const p3="Paul";
		var p4="Jacques";
		document.write(p1+p2+" "+p3+" "+p4);
	}
	sacre("Les prophètes ");
	//document.write(p1);
	//document.write(p2);
	//document.write(p3);
	document.write(p4);
	</script>

Variables globales ou locales?

  • une variable déclarée (où que ce soit) sans const, let ou var aura une portée illimitée, et sera donc globale.
  • une variable déclarée en dehors d'un bloc avec const, let ou var aura une portée illimitée et sera donc globale.
    -----
  • une variable déclarée dans un bloc (quel qu'il soit) avec const ou let aura une portée limitée à ce seul bloc et aux blocs imbriqués et sera donc locale.
  • une variable déclarée dans un bloc autre que celui d'une fonction avec var aura une portée illimitée et sera donc globale.
    -----
  • une variable déclarée dans le bloc d'une fonction avec var aura une portée limitée à ce seul bloc et aux blocs imbriqués et sera donc locale.
  • une variable déclarée en tant que paramètre d'une fonction aura une portée limitée au bloc d'instructions de la fonction et aux blocs imbriqués et sera donc locale.
Cas 1: Deux variables globales déclarées sans const, let ou var

Démo
	<h2>Portée des variables</h2>
	<script>
	valeur=5;
	function affic(){
		montant=69;
		document.write("A partir de la fonction Affic():"+valeur+", "+montant+"<br>");
	}
	affic();
	document.write("A partir du programme général:"+valeur+", "+montant);
	</script>

valeur et montant répondent à la règle 1


Cas 2: une variable globale déclarée avec const, let ou var

Démo
	<h2>Portée des variables</h2>
	<script>
	let valeur=5;
	//const valeur=5;
	//var valeur=5;
	function affic(){
		document.write("A partir de la fonction Affic():"+valeur+"<br>");
	}
	affic();
	document.write("A partir du programme général:"+valeur);
	</script>

valeur répond à la règle 2


Cas 3: une variable déclarée avec const et let dans un bloc autre que celui d'une fonction
Démo
<h2>Portée des variables</h2>
<script language="JavaScript">
var flag=true;
if(flag){
	let val1=4;
	const val2=5;
	console.log(val1,val2);
}
	console.log(val1,val2);
</script>

val1 et val2 répondent à la règle 3

Cas 3bis: une variable locale déclarée avec let dans un bloc
Démo
<h2>Portée des variables</h2>
<script>
var val=2;
if(val===2){
	let resultat="Vous êtes deuxième";
	document.write("Dans le if: "+resultat+" pour la valeur "+val+"<br>");
		if(true){
			document.write("Dans le if imbriqué: "+resultat+" pour la valeur "+val+"<br>");
		}
}
document.write("Valeur: "+val+"<br>");
//la ligne suivante n'affichera rien
document.write("Contenu de resultat: "+resultat);
</script>

val répond à la règle 2 et resultat répond à la règle 3


Cas 4: une variable déclarée avec var dans un bloc autre que celui d'une fonction
Démo
<h2>Portée des variables</h2>
<script language="JavaScript">
var flag=true;
if(flag){
	var val1=4;
	var val2=5;
	console.log(val1,val2);
}
	console.log(val1,val2);
</script>

val1 et val2 répondent à la règle 4


Cas 5: une variable déclarée avec var dans un bloc de fonction
Démo
<h2>Portée des variables</h2>
<script language="JavaScript">
let valeur=5;
function affic(valeur){
var res;
res= valeur * valeur;
document.write("A partir de la fonction Affic():"+res+"
"); } affic(valeur); document.write("A partir du programme général:"+res); </script>

res répond à la règle 5



Cas 6: une variable déclarée en tant que paramètre
Démo
	<h2>Portée des variables</h2>
	<script>
	var valeur=5;
	function affic(fval){
	document.write("A partir de la fonction Affic():"+fval+"<br>");
	}
	affic(valeur);
	//la ligne suivante n'affichera rien
	document.write("A partir du programme général:"+fval);
	</script>

fval répond à la règle 6.


Conflit entre variable locale et globale

Que se passe-t-il lorsqu'une variable globale porte le même nom qu'une variable locale?

Démo
<h2>Les variables locales</h2>
<script>
var res=2;
function superf(){
 var res=3;
document.write("Contenu de res: "+res);
}
superf();
document.write("<br>Contenu de res: "+res);
</script>

On constate:

  • la variable locale prime sur la variable globale, c'est bien la variable res déclarée dans la fonction qui est affichée par le document.write de la fonction
  • le document.write hors fonction affiche le contenu de la variable globale res