ES6 基礎學習
一、let和const
let命令
let命令,用來宣告變數。它的用法類似於var,但是所宣告的變數,只在let命令所在的程式碼塊內有效;是塊級作用域,且let
不允許在相同作用域內,重複宣告同一個變數。
{ let a = 12; } console.log(a); //Uncaught ReferenceError: a is not defined
{ let a = 12; let a = 22; } console.log(a); //Uncaught SyntaxError: Identifier 'a' has already been declared
另一個例子:
var a = []; for (var i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6]();
上面程式碼中,變數i
是var
命令宣告的,在全域性範圍內都有效,所以全域性只有一個變數i
。每一次迴圈,變數i
的值都會發生改變,而迴圈內被賦給陣列a
的函式內部的console.log(i)
,裡面的i
指向的就是全域性的i
。也就是說,所有陣列a
的成員裡面的i
,指向的都是同一個i
,導致執行時輸出的是最後一輪的i
的值,也就是10。
如果使用let
var a = []; for (let i = 0; i < 10; i++) { a[i] = function () { console.log(i); }; } a[6]();
上面程式碼中,變數i
是let
宣告的,當前的i
只在本輪迴圈有效,所以每一次迴圈的i
其實都是一個新的變數,所以最後輸出的是6
。你可能會問,如果每一輪迴圈的變數i
都是重新宣告的,那它怎麼知道上一輪迴圈的值,從而計算出本輪迴圈的值?這是因為 JavaScript 引擎內部會記住上一輪迴圈的值,初始化本輪的變數i
不存在變數提升
var
命令會發生"變數提升"現象,即變數可以在宣告之前使用,值為undefined。為了糾正這種現象,
let
命令改變了語法行為,它所宣告的變數一定要在聲明後使用,否則報錯。
console.log(x); // 輸出undefined var x = 2; console.log(s); // 報錯ReferenceError: s is not defined let s = 2;
const命令
const
宣告一個只讀的常量。一旦宣告,常量的值就不能改變。
const PI = 3.1415; PI = 3; // TypeError: Assignment to constant variable.
const
宣告的變數不得改變值,這意味著,const
一旦宣告變數,就必須立即初始化,不能留到以後賦值。
const
的作用域與let
命令相同:只在宣告所在的塊級作用域內有效,也不能重複宣告。
二、模板字串
模板字串(template string)是增強版的字串,用反引號(`)標識。它可以當作普通字串使用,也可以用來定義多行字串,或者在字串中嵌入變數。
var a = "Hello"; var b = "World"; var str = `${a} ${b}!`; console.log(str); // Hello World!
如果在模板字串中需要使用反引號,則前面要用反斜槓轉義。
let greeting = `Hello \`pd\`!`; console.log(greeting); // Hello `pd`!
如果使用模板字串表示多行字串,所有的空格和縮排都會被保留在輸出之中。
console.log( `<ul> <li>first</li> <li>second</li> </ul>` ) // 輸出 <ul> <li>first</li> <li>second</li> </ul>
1