談談神祕的ES6——（二）ES6的變量

時間 2019-11-12

原文原文鏈接

談談神祕的ES6——（二）ES6的變量

咱們在《零基礎入門JavaScript》的時候就說過，在ES5裏，變量是有弊端的，咱們先來回顧一下。javascript

首先，在ES5中，咱們全部的變量都是經過關鍵字var來定義的。而這種變量呢，是存在弊端的，1.可重複聲明；2.沒法限制修改；3.沒有塊級做用域。而這三個弊端，可能會致使變量使用混亂、或者變量值受到污染。舉一個最簡單的例子：html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
</body>
<script type="text/javascript">
    var lis = document.querySelectorAll('li');
    for (var i = 0; i < lis.length; i++) {
        lis[i].onclick = function () {
            console.log(i);//都是5
        }
    }
</script>

</html>

上邊這個例子呢，很明顯，這個i呢，咱們在點擊時，i其實已經循環完畢，在ES5中，想要解決這個問題，就只能用閉包了。關於閉包，等咱們講JS進階的時候，再詳細講一講。java

<script type="text/javascript">
    var lis = document.querySelectorAll('li');
    for (var i = 0; i < lis.length; i++) {
        lis[i].onclick = (function (j) {
            return function () {
                console.log(j);
            }
        })(i)
    }
</script>

而在ES6裏邊呢，咱們上述的三個弊端，已經有了比較好的解決方案。微信

在ES6中，首次提出了let和const兩個關鍵字，let用來聲明變量，不可重複聲明，能夠修改，有塊級做用域；const用來聲明常量，不可修改，一樣不可重複聲明，有塊級做用域。閉包

let a = 10;
let a = 20; //Uncaught SyntaxError: Identifier 'a' has already been declared

const b = 10;
const b = 20; //Uncaught SyntaxError: Identifier 'b' has already been declared

const c = 10;
c = 20;//Uncaught TypeError: Assignment to constant variable.

好了，這節課就說到這裏，下一節課，咱們來說講函數。函數

若是想跟着振丹繼續學習，能夠微信關注【振丹敲代碼】（微信號：JandenCoding）學習

新博文微信同步推送，還附有講解視頻哦~spa

也可直接掃描下方二維碼關注。code