Maison > interface Web > js tutoriel > Comment utiliser les variables locales et les variables globales en JavaScript et quelles sont leurs différences ?

Comment utiliser les variables locales et les variables globales en JavaScript et quelles sont leurs différences ?

伊谢尔伦
Libérer: 2017-07-18 09:50:10
original
2345 Les gens l'ont consulté

Javascript a deux types de variables : les variables locales et les variables globales.

Tout d'abord, les variables locales ne peuvent être appelées que dans la fonction où cette variable est déclarée. Les variables globales sont des variables qui peuvent être appelées dans tout le code. Bien sûr, il n'est certainement pas clair de le comprendre littéralement. Permettez-moi de le présenter en détail ci-dessous :
Comme nous le savons tous, les variables doivent être déclarées avec le mot-clé var. Cependant, les variables peuvent également être utilisées implicitement en JavaScript, c'est-à-dire qu'elles peuvent être utilisées directement sans déclaration. De plus, veillez à noter que JavaScript utilise toujours des variables implicitement déclarées comme variables globales.
Par exemple :

function myName() {
 i = 'yuanjianhang';
}
myName();
function sayName() {
 alert(i);
}
sayName();
Copier après la connexion
Copier après la connexion

Le résultat de sortie est : yuanjianhang

Cela montre que la variable i est une variable globale si le code ci-dessus est modifié comme suit :

function myName() {
 var i='yuanjianhang';
}
myName();
function sayName() {
 alert(i);
}
sayName();
Copier après la connexion

Pour le moment, le navigateur n'aura aucun résultat de sortie, car i est défini dans la fonction myName, il ne s'agit donc que d'une variable locale de myName et ne peut pas être appelée en externe.


Regardons maintenant le code suivant :

function myName() {
 i = 'yuanjianhang';
}
myName();
function sayName() {
 alert(i);
}
sayName();
Copier après la connexion
Copier après la connexion

Maintenant, apportons quelques modifications et supprimons myName();. Le code est le suivant :

function myName() {
 i = 'yuanjianhang';
}
function sayName() {
 alert(i);
}
sayName();
Copier après la connexion

Pour le moment, le navigateur ne répondra pas. Parce que bien que i soit une variable globale, la fonction myName() n'a pas été appelée, cela équivaut donc à déclarer i mais sans lui attribuer de valeur, donc il n'y a pas de sortie.
De même, si vous remplacez l'exemple ci-dessus par :

function myName() {
 
 i = 'yuanjianhang';
}
function sayName() {
 alert(i);
}
sayName();
myName();
Copier après la connexion

Dans ce cas, aucun résultat ne sera affiché. Le code javascript est exécuté de haut en bas, dans la fonction sayName(). vérifiera la valeur de la variable i lorsqu'elle sera appelée. À ce stade, la fonction myName n'a pas encore été exécutée, ce qui signifie qu'aucune valeur n'a été attribuée à i, donc aucun résultat ne sera affiché.

La norme pour diviser la portée de JavaScript est le bloc de fonction, pas if, while, for

<script>
function f1(){
   alert("before for scope:"+i);   
 //i未赋值(并不是没有声明!使用未声明变量或函数会导致致命错误从而中断脚本执行)
 //此时i值为undefined
   for(var i=0; i<3;i++){
       alert("in for scope:"+i);}
 //i的值是0,1,2 
   alert(“after for scope:”+1);
  //i的值是3,此时已经在for scope之外,但i的值仍然保留为3
    while(true){
       var j=1;
       break;}
    alert(j);
  //j的值是1,此时已经在while scope之外,但j的值仍然保留为1
    if(true){
      var k=1;
    }
    alert(k);
  //k的值为1,此时已经在if scope之外,但k的值仍保留为1
}
f1();
//此时在函数块外调用函数,再次输出存在于f1这个function scope里的i j k变量
alert(i);
//error!!!原因是这里的i未声明(不是未赋值,区别f1的第一行输出),脚本错误,程序结束!
alert(j);   
//未执行
alert(k);
//未执行
</script>
Copier après la connexion

JavaScript précompilera l'intégralité du fichier de script avant l'exécution (script Analyser la partie déclaration. du fichier, y compris la partie variable locale) pour déterminer la portée des variables réelles. Par exemple, ci-dessous :

<script>
   var x=1;
   function f2(){
    alert(x);
   //x的值为undefined!这个x并不是全局变量,因为在function scope已经又声明了一个重名的局部变量,所以全局变量的参数a被覆盖了。
    说明了JavaScript在执行前会进行预编译,函数体内的x就被指向局部变量,而不是全局变量。此时x只有声明,没有赋值,所以为undefined
    x=3;
    alert(x);
   //x值为3.但还是局部变量
    var x;
   //局部变量x在这里声明
    alert(x);
   //值为3
   }
   f2();
   alert(x);
   //x值为1,并不是在function scope内,x的值为全局变量的值。
</script>
Copier après la connexion

Lorsqu'une variable globale a le même nom qu'une variable locale, la portée de la variable locale écrasera la portée de la variable globale lorsque vous quittez la portée de la variable locale. variable, elle reviendra à la variable globale. La portée de la variable, et lorsque la variable globale rencontre la variable locale,

Comment utiliser la variable globale ? Utilisez window.globalVariableName.

<script>
   var a=1;
    function f3(){
       alert(window.a);
  //a位1,这里的a是全局变量
       var a=2;
        alert(a);
      }
    f3();
    alert(a);
</script>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal