目標(biāo)

• ES6簡(jiǎn)介
• ECMAScript 和 JavaScript 的關(guān)系
• let命令
• 塊級(jí)作用域
• const命令
• 字符串的擴(kuò)展-模板字符串

ES6簡(jiǎn)介

ECMAScript 6.0（以下簡(jiǎn)稱 ES6）是 JavaScript 語(yǔ)言的下一代標(biāo)準(zhǔn)，已經(jīng)在2015年6月正式發(fā)布了。它的目標(biāo)，是使得 JavaScript 語(yǔ)言可以用來(lái)編寫(xiě)復(fù)雜的大型應(yīng)用程序，成為企業(yè)級(jí)開(kāi)發(fā)語(yǔ)言。

ECMAScript 和 JavaScript 的關(guān)系

類似接口和實(shí)現(xiàn)類的關(guān)系

ECMAScript 和 JavaScript 的關(guān)系是，前者是后者的規(guī)格，后者是前者的一種實(shí)現(xiàn)（另外的 ECMAScript 方言還有 Jscript 和 ActionScript）。日常場(chǎng)合，這兩個(gè)詞是可以互換的。

let命令

特點(diǎn)：1、在塊級(jí)作用域內(nèi)有效 2、不存在變量提升 3、不可被重復(fù)定義

1、在塊級(jí)作用域內(nèi)有效的例子

       <script type="text/javascript">
        {
            var a = 1;
            let b = 2;
        }
        console.log(a);
        console.log(b);
    </script>

image.png

2、不存在變量提升

    <script type="text/javascript">
        console.log(a);
        var a=10;
        console.log(b);
        let b=20;
    </script>

image.png

3、不可以被重復(fù)定義

    <script type="text/javascript">
                let username="a";
                let username="b";
                console.log(username);
    </script>

image.png

上面代碼中的LET改成var是允許的

塊級(jí)作用域

為什么需要塊級(jí)作用域？
ES5只有全局作用域和函數(shù)作用域，沒(méi)有塊級(jí)作用域，這帶來(lái)很多不合理的場(chǎng)景。
一種場(chǎng)景，內(nèi)層變量可能會(huì)覆蓋外層變量。

    <script type="text/javascript">
        var tmp = new Date();
        function f() {
          console.log(tmp);
           if (false) {
            var tmp = "hello world";
          } 
        }
        f(); // undefined
    </script>

上面代碼中，函數(shù)f執(zhí)行后，輸出結(jié)果為undefined，原因在于變量提升，導(dǎo)致內(nèi)層的tmp變量覆蓋了外層的tmp變量。

const命令

    <script type="text/javascript">
        const i=120;
        i=123;
        console.log(i);
    </script>

image.png

字符串的擴(kuò)展-模板字符串

作用：簡(jiǎn)化字符串拼接，
寫(xiě)法：變量的寫(xiě)法類似el表達(dá)式 ${}，最外面不用單引或者雙引，用`（tab鍵上面的字符）

    <script type="text/javascript">
        let obj={username:"張三",age:18};
        let str=`我的名字叫${obj.username},我今年${obj.age}歲`;
        console.log(str);
    </script>