关于var ，let ，const，声明变量时的区别

最新推荐文章于 2024-04-15 16:20:18 发布

宋哈哈

最新推荐文章于 2024-04-15 16:20:18 发布

阅读量666

点赞数 1

分类专栏： es6

本文链接：https://blog.csdn.net/qq_40028324/article/details/80788093

版权

8 篇文章 0 订阅

订阅专栏

在js中对于一个初学者而言，用的最多的可能就是var来声明变量了。慢慢的会发现还有let和const，那么他们

之间有啥区别的？？

首先先看一下这个表格

变量提升

啥叫变量提升呢？比如：

console.log（v1 ,l1, c1）

var v1='v1'; let l1='l1'; const c1= 'c1'

此时会报错因为只有var声明的变量会有变量提升，let 和const声明的变量都不会被提升，所以打印的时候l1和c1都还没有呢，肯定就报错了。

作用域

const，let 支持块级作用域，有效避免变量覆盖

var v21 = 'v21;

let l21 = 'l21';

const c21 = 'c21';

 
 if 
 (0.1 + 0.2 != 0.3) { 

 
   
 const c21 =  
 'c22' 
 ; 

 
   
 let l21 =  
 'l22' 
 ; 

 
   
 var 
 v21 =  
 'v22' 
 ; 

 
   
 console.log(c21, l21, v21); 

 
   
 // 输出 c22 l22 v22 

}

 
 console.log(c21, l21, v21); 

 
 // 输出 c21 l21 v22 

块级作用域，在外层不能直接访问内层变量

 
 if 
 (0.1 + 0.2 != 0.3) { 

 
   
 const c22 =  
 'c22' 
 ; 

 
   
 let l22 =  
 'l22' 
 ; 

 
   
 var 
 v22 =  
 'v22' 
 ; 

 
   
 console.log(c22, l22, v22); 

 
   
 // 输出 c22 l22 v22 

}

 
 console.log(c22, l22, v22); 

 
 // 报错 

 
 // Uncaught ReferenceError: c22 is not defined 

 
 // 同样地, l22 is not defined 

const 定义常量，该常量不能赋值，但该常量的属性可以赋值

 
 const c231 = {}; 

 
 const c232 = []; 

 
 c231.name =  
 'seven' 
 ; 

 
 c232.push(27); 

 
 console.log(c231, c232); 

 
 // 输出 {name: "seven"} [27] 

全局变量不再设置为顶层对象（window）的属性，有效避免全局变量污染

 
 const c24 =  
 'c24' 
 ; 

 
 let l24 =  
 'l24' 
 ; 

 
 console.log(c24, l24); 

 
 // 输出 c24 l24 

 
 console.log(window.c24, window.l24); 

 
 // 输出 undefined undefined 

符合预期的 for 循环

 
 for 
 ( 
 var 
 i = 0; i != 3; i++) { 

 
   
 setTimeout( 
 function 
 () { 

 
    
 console.log(i); 

 
   
 },10); 

}

 
 // 333 

 
 for 
 (let i = 0; i != 3; i++) { 

 
   
 setTimeout( 
 function 
 () { 

 
    
 console.log(i); 

 
   
 },10); 

}

 
 // 依次打印 1,2,3 

可以看到在 for 循环中使用 let 方式声明变量才是符合预期。

在 for 中每一次循环，let 都是重新声明变量，并且因为 JavaScript 引擎会记住上一次循环的值，初始化 i 时在上一轮的基础上计算。

这个东西多用几次就明白了。共同成长~~~~

关注