Comment le levage et la portée des fonctions JavaScript affectent-ils l'écrasement des variables ?

Portée et levage des fonctions Javascript : une plongée plus approfondie

L'article de Ben Cherry sur la portée et le levage Javascript présente les concepts de levage de fonctions et de portée variable . Pour mieux comprendre leur impact, examinons un exemple intrigant qu'il fournit :

var a = 1;

function b() {
    a = 10;
    return;

    function a() {}
}

b();
alert(a);

Exécutez ce code et vous constaterez qu'il alerte « 1 », ce qui peut sembler déroutant.

Le levage de fonctions est un concept crucial pour élever les déclarations de fonctions au début de leur portée. Cela signifie que le code ci-dessus est effectivement réécrit comme :

function b() {
  function a() {}
  a = 10;
  return;
}

Assez curieusement, la fonction dans la fonction, a(), fonctionne de la même manière qu'une déclaration de variable (var a = function () {};) . Considérez ceci :

var a = 1;

function b() {
  var a = function () {};
  a = 10;
  return;
}

b();
alert(a);

Les deux versions donnent exactement le même résultat.

Essentiellement, le code fait ceci :

var a = 1;                 // Defines "a" in the global scope
function b() {  
   var a = function () {}; // Defines "a" in the local scope 
   a = 10;                 // Overwrites the local variable "a"
   return;      
}       
b();       
alert(a);                 // Alerts the global variable "a"

La clé à retenir est que la fonction de levage et la portée variable interagit pour produire ce comportement. La fonction interne crée une variable locale a, tandis que la déclaration de fonction elle-même élève la fonction au sommet. Cela conduit finalement à un être défini globalement qui n'est pas affecté par les changements au sein de la fonction.

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!