ES6中塊級(jí)作用域的案例分析-創(chuàng)新互聯(lián)

這篇文章主要介紹了ES6中塊級(jí)作用域的案例分析，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

臺(tái)州網(wǎng)站建設(shè)公司成都創(chuàng)新互聯(lián)公司,臺(tái)州網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為臺(tái)州上千余家提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站制作要多少錢，請找那個(gè)售后服務(wù)好的臺(tái)州做網(wǎng)站的公司定做！

全局作用域和函數(shù)作用域

在ES5中，只全局作用域和函數(shù)作用域。這會(huì)導(dǎo)致函數(shù)作用域覆蓋了全局作用域；亦或者循環(huán)中的變量泄露為全局變量。

例如：

//  1.函數(shù)作用域覆蓋了全局作用域,發(fā)生了變量提升，函數(shù)聲明大于var聲明的變量，因此函數(shù)里面的a提到了前面，在打印a，初始化一個(gè)undefined給a,所以打印出了undefined。
var a = '1';
function fn() {
    console.log(a);
    if (3<2) {
        var a  = 3;
    }
}
fn(); // undefined
// 2.循環(huán)中的變量泄露為全局變量
for(var i=0;i<5;i++) {
    console.log(i);
}
console.log(i); // 5;

ES6的塊級(jí)作用域

用let命令新增了塊級(jí)作用域，外層作用域無法獲取到內(nèi)層作用域，非常安全明了。即使外層和內(nèi)層都使用相同變量名，也都互不干擾。

// 1.外層作用域無法獲取到內(nèi)層作用域
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. 外層和內(nèi)層都使用相同變量名，也都互不干擾
{  
    {
        let food = 'apple';
        console.log(food); // apple
    }
    let food = 'orange';
    console.log(food); // orange
}

塊級(jí)作用域和和函數(shù)聲明

在ES5中，函數(shù)只能在頂級(jí)作用域和函數(shù)作用域中聲明，不能在塊級(jí)作用域中聲明。但是在ES6中，函數(shù)可以在塊級(jí)作用域中聲明。

但是會(huì)有一定的問題，因?yàn)楹瘮?shù)聲明會(huì)被提到代碼的最前面。所以會(huì)報(bào)錯(cuò)，最好在ES6中用函數(shù)表達(dá)式來表示一個(gè)函數(shù)。

例如：

//1.函數(shù)聲明報(bào)錯(cuò)
{
    if (4 < 2) {
        function fn() {
            console.log('我在函數(shù)里面！');
        }
    }
}
fn(); // Uncaught TypeError: fn is not a function
//2.函數(shù)表達(dá)式?jīng)]錯(cuò)
{
    let fa = '111';
    let fn = function () {
        console.log('我在函數(shù)里面！');
    }
    console.log(fa,fn); // 111 ? () { console.log('我在函數(shù)里面！');}
}

注意：ES6中允許函數(shù)在塊級(jí)作用域中可以聲明的條件是必須在大括號(hào)里面，否則就會(huì)報(bào)錯(cuò)。

// 1.報(bào)錯(cuò)的情況
if (4>2) {
    let fn = function () {};
}

//2.報(bào)錯(cuò)的情況
if (4>2)
    let fn = function () {}; // Uncaught SyntaxError: Lexical declaration cannot appear in a single-statement context

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享ES6中塊級(jí)作用域的案例分析內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)建站，關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道，遇到問題就找創(chuàng)新互聯(lián)建站，詳細(xì)的解決方法等著你來學(xué)習(xí)!

文章名稱：ES6中塊級(jí)作用域的案例分析-創(chuàng)新互聯(lián)
文章出自：http://muchs.cn/article40/dsisho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供電子商務(wù)、網(wǎng)站收錄、品牌網(wǎng)站制作、微信公眾號(hào)、企業(yè)建站、網(wǎng)站維護(hù)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容