Une brève explication de la portée de la fonction et de la portée au niveau du bloc en JavaScript

Cet article vous présente une brève explication de la portée des fonctions et de la portée au niveau du bloc en JavaScript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

1. Portée au niveau de la fonction

Regardons d'abord un morceau de code

var a = true;

function hoisting(){
    if(!a){
        var a = 2;
    }
    console.log(a)
}

hoisting();
// 最终结果：2

La logique de ce code is

1. recherchera d'abord les variables dans le 函数域 actuel.

2. S'il existe, déclarez d'abord l'en-tête de la variable. S'il n'existe pas, recherchez à nouveau

3. à partir du parent jusqu'à ce qu'il soit trouvé.

Ensuite, nous pouvons le réécrire comme

var a; // 变量声明 
a = true; // 变量定义

function hoisting(){
    var a; // 变量声明
    if(!a){
        a = 2; //变量定义
    }
    console.log(a) // 先从自身函数域开始查找，找不到再去父作用域
}

hoisting();

Des variables Javascript existent avec une fonction comme portée Lorsqu'elles ne peuvent pas être trouvées localement, elles iront au parent pour les trouver. eux. .

2. Solution : Fermeture IIFE

Cela n'a peut-être pas grand-chose à voir avec cet article ~~, l'essentiel est que la fermeture construise un nouveau domaine de fonctions.

Expression de fonction immédiatement invoquée

Sa fonction est d'attribuer une valeur à la variable avant qu'elle ne soit appelée

var a = (function(){
    var a = 3
    return a
}())

3.

La fonction principale de let et const est d'ajuster la portée originale au niveau de la fonction de JavaScript à la portée au niveau du bloc

let a = 2;

function block(){
    if(!a){
        let a =1
    }
    console.log(a)
}

block() // 2

À l'heure actuelle, la portée du fonction Il est divisé en unités plus petites, au niveau du bloc.

On peut diviser le code en trois blocs

• if bloc

• bloc bloc

• blocage de fenêtre

D'accord, maintenant que se passe-t-il si nous réécrivons la fonction ?

let a = 0;

function block(){
    if(!a){
        let a =1
    }
    console.log(a)
}

block() // 0

Le résultat final est 0, quand a n'est pas trouvé dans le bloc actuel Lorsqu'il arrivera, il recherchera dans le bloc parent, et finalement ce sera 0

Les variables du bloc if ne sont valables que dans le bloc

Articles connexes recommandés :

Analyse JS de l'encapsulation dans la programmation orientée objet

Comment s'appelle la fonction anonyme auto-appelante de jQuery ?

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!