ES6新增变量声明

原创已于 2022-02-21 17:39:24 修改 · 1.5k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #p2p #linq

于 2022-02-21 17:35:29 首次发布

WEB 同时被 3 个专栏收录

4 篇文章

订阅专栏

JavaScript

4 篇文章

订阅专栏

ES6

3 篇文章

订阅专栏

本文详细介绍了JavaScript中let和const变量的声明特点，包括局部作用域、不可重复声明、变量提升以及const的独特性质如常量赋值和不可修改。通过HTML实例演示了它们在实际代码中的应用。同时，讨论了const的正确使用方法和常见误区。

let变量声明
   1.局部作用域
   2.不能重复声明
   3.不会变量提升

let代码实例

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title></title>
   </head>
   <body>
       <ul>
           <li>第一行列表1</li>
           <li>第二行列表2</li>
           <li>第三行列表3</li>
           <li>第四行列表4</li>
           <li>第五行列表5</li>
       </ul>
       <script>
           // var lis = document.querySelectorAll('ul li');
           // for(let i=0;i<lis;length,i++){
           //    lis[i].onclick = function(){
           //        alert(i+1)
           //    }
           // }

           var lis = document.querySelectorAll('ul li');
           for(var i=0;i<lis.length;i++){
               (function(i){
                   lis[i].onclick = function(){
                       alert(i+1)
                   }
               })(i)
           }
       </script>
   </body>
</html>

const变量声明
   1.局部作用域
   2.不能重复声明
   3.不会变量提升
   4.生命必须赋值
   5.声明后不能修改
   6.建议声明变量必须大写

const代码实例

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title></title>
   </head>
   <body>
       <script>
           // 正确方式
           const list1 =[1,2,3];
           list1.push(4);
           alert(list1);


           // 错误方式
           const list2 =[1,2,3];
           list2 = [1,2,3,4]
           alert(list1);
       </script>
   </body>
</html>