【Es6入门实践】02let和const 命令

let 命令

ES6 新增了 let 命令，用于声明变量。其用法类似于 var ，但是所声明的变量只在 let命令所在的代码块内有效。

回顾

我们知道，var是全局声明

var a="cola";
//console.log(a)

window.onload = function() {
  console.log(a)
}

在终端输入打包命令行

npm run build

在浏览器查看效果

在这里插入图片描述

var a="cola";
//console.log(a)

// window.onload = function() {
//   console.log(a)
// }

{
  var a = "可口可乐"
}
console.log(a)

在这里插入图片描述
所以说var是全局声明，会污染空间，后面的值覆盖前面的值

这时候我们把块域里面的var改成let

var a="cola";
//console.log(a)

// window.onload = function() {
//   console.log(a)
// }

{
  let a = "可口可乐"
}
console.log(a)

这个时候我们发现浏览器显示结果如下
在这里插入图片描述
说明let是局部变量，不会污染全局

{
  var a = 10; 
  let b = 1; 
}
console.log(a)
console.log(b)

浏览器显示结果

在这里插入图片描述

上面的代码在代码块中分别用 let 和 var 声明了两个变量。然后在代码块之外调用这两个变量，结果 let 声明的变量报错， var 声明的变量返回了正确的值。这表明， let 声明的变量只在其所在代码块内有效。

for 循环的计数器就很适合使用 let 命令

for (let i = 0 ; i < 10 ; i++) { 
  console.log('循环体里面'+i)
}
console.log('循环体外面'+i)

在这里插入图片描述
以上代码中的计数器 i 只在 for 循环体内有效，在循环体外引用就会报错。

简答来说，就是外部的这个数据被污染了。

下面的代码如果使用 var ，最后将输出 10

for (var i = 0 ; i < 10 ; i++) { 
  console.log('循环体里面'+i)
}
console.log('循环体外面'+i)

在这里插入图片描述
上面的代码中，变量 i 是 var 声明的，在全局范围内都有效，所以全局只有一个变量i。

每一次循环，变量 i 的值都会发生改变，而循环内，被赋给数组 a 的函数内部的console.log(i）中的指向全局的 i。也就是说，所有数组 a 的成员中的 i 指向的都是同一个 i ，导致运行时输出的是最后一轮的 i 值，也就是 10。

const是一个常量，声明之后不能再次声明

const a=1;
var a=2;
console.log(a)

如果这个写，在终端输入命令行之后就会报错提示我们
在这里插入图片描述
再次重申一下为什么使用let

var 命令会发生“变量提升”现象，即变量可以在声明之前使用，值为 undefined 。这种现象多少是有些奇怪的，按照一般的逻辑，变量应该在声明语句之后才可以使用。
为了纠正这种现象， let 命令改变了语法行为，它所声明的变量一定要在声明后使用，否则便会报错，也就是说let不存在变量提升

发布了227 篇原创文章 · 获赞 41 · 访问量 2万+

私信关注