Introduction détaillée à la portée au niveau du bloc dans ES6 (exemple de code)

Cet article vous apporte une introduction détaillée (exemple de code) sur la portée au niveau du bloc dans ES6. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère que cela vous aidera.

Aujourd'hui, discutons de la portée au niveau du bloc dans ES6.

Portée globale et portée de la fonction

Dans ES5, il n'y a que la portée globale et la portée de la fonction. Cela entraînera la portée de la fonction à couvrir la portée globale ; ou les variables de la boucle seront divulguées dans les variables globales.

Par exemple :

//  1.函数作用域覆盖了全局作用域,发生了变量提升，函数声明大于var声明的变量，因此函数里面的a提到了前面，在打印a，初始化一个undefined给a,所以打印出了undefined。
var a = '1';
function fn() {
    console.log(a);
    if (3<2) {
        var a  = 3;
    }
}
fn(); // undefined
// 2.循环中的变量泄露为全局变量
for(var i=0;i<5;i++) {
    console.log(i);
}
console.log(i); // 5;

Portée au niveau du bloc ES6

Utilisez la commande let pour ajouter une nouvelle portée au niveau du bloc et une nouvelle portée externe La portée intérieure ne peut pas être obtenue, ce qui est très sûr et clair. Même si les couches externe et interne utilisent le même nom de variable, elles n’interféreront pas l’une avec l’autre.

// 1.外层作用域无法获取到内层作用域
function fn1() {
    let a = 41;
    if(1 == 1) {
        let a = 3;
        console.log(2,a); // 2 3
    }
    console.log(1,a); // 1 41
}
fn1();

{  
    {
        let food = 'apple';
    }
    console.log(food); // Uncaught ReferenceError: food is not defined
}

{  
    {
        let food = 'apple';
    }
    console.log(food); // Uncaught ReferenceError: food is not defined
}

// 2. 外层和内层都使用相同变量名，也都互不干扰
{  
    {
        let food = 'apple';
        console.log(food); // apple
    }
    let food = 'orange';
    console.log(food); // orange
}

Portée au niveau du bloc et déclaration de fonction

Dans ES5, les fonctions ne peuvent être déclarées que dans la portée de niveau supérieur et la portée de la fonction, pas dans les blocs déclarés dans portée de niveau. Mais dans ES6, les fonctions peuvent être déclarées dans la portée du bloc.

Mais il y aura certains problèmes, car la déclaration de fonction sera placée au début du code. Par conséquent, une erreur sera signalée. Il est préférable d’utiliser des expressions de fonction pour représenter une fonction dans ES6.

Par exemple :

//1.函数声明报错
{
    if (4 < 2) {
        function fn() {
            console.log(&#39;我在函数里面！&#39;);
        }
    }
}
fn(); // Uncaught TypeError: fn is not a function
//2.函数表达式没错
{
    let fa = &#39;111&#39;;
    let fn = function () {
        console.log(&#39;我在函数里面！&#39;);
    }
    console.log(fa,fn); // 111 ƒ () { console.log(&#39;我在函数里面！&#39;);}
}

Remarque : La condition qui permet de déclarer les fonctions dans la portée au niveau du bloc dans ES6 doit être entre accolades, sinon une erreur sera signalé.

// 1.报错的情况
if (4>2) {
    let fn = function () {};
}

//2.报错的情况
if (4>2)
    let fn = function () {}; // Uncaught SyntaxError: Lexical declaration cannot appear in a single-statement context

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!