ES6中let和const的用法及与var的区别详解

ES6—— let 和 const 命令

引言

本文主要讲解ES6中变量的相关操作，变量的命名， 讲解 var、 let 、 const 三者的区别

正文

ES6中的 let 和 const 都是用来声明变量的， 他们与 var 有所区别

let 命令

在for循环中，我们命名的变量 i 通常仅用于循环内部，期望循环结束后该变量随之销毁。然而，使用 var 声明的变量在 for 循环结束后并不会消失，而是会泄露到全局作用域中。

for(var i=0; i<5; i++) {
	console.log('循环'+ i)
}
console.log(i)

/* 输出结果 */ 循环1 循环2 循环3 循环4 5 // 这里是循环外输出的i

如果在 for 循环中使用 let 来命名变量，结果会有何不同？

for(let i=0; i<5; i++) {
	console.log('循环'+ i)
}
console.log(i)

/* 输出结果 */ 循环1 循环2 循环3 循环4 undefined // 这里是循环外输出的i,显示未定义

这种方式解决了因 var 声明导致的变量泄露问题。其本质在于作用域：let 仅作用于其所在的代码块内，而 var 则针对全局有效。例如以下简单示例：

{
	let i = 1
	var n = 2
}
console.log(i)
console.log(n)

/* 输出结果 */ undefined 2

从输出可见，let 声明的变量仅存在于该代码块内，在外部无法访问；而 var 声明的变量则针对全局有效。

const 命令

const 与 let 类似，声明的变量只能在所在代码块内被访问，外部无法访问。但 const 与 let 的区别在于，const 声明的变量是只读的，即命名后无法在后续代码中重新赋值。例如以下示例：

const a = 'apple'
let b = 'orange'

a = 'watermelon'
b = 'banana'

/* 输出结果 */ a = 'watermelon' ^

显而易见，系统会直接报错，因为 const 声明的变量 a 是无法改变的，后续无法对其进行赋值操作。

实际上，const 声明变量后并非绝对无法改变。因为 const 声明时是将箭头指向内存中的一个对象，只要不改变该对象的内存地址，const 声明的变量内容仍可变化。例如：

const list1 = []

list1.push('变化1')

console.log(list1)

// ['变化1']

可以看到 list1.push(' 变化1 ') 不会改变 变量 list1在内存中的地址。

但是 list1 = [ '变化1' ] 就会改变 list1 在内存中的地址，所以会报错

const list1 = []

list1 = ['变化1']

console.log(list1)

// 报错：list1 = ['变化1']
       ^

结束语

这就是 let 和 const 的简单应用，希望对大家有所帮助， 下一篇ES6（2）将讲解变量的解构赋值

到此这篇关于JavaScript中ES6规范中let和const的用法和区别的文章就介绍到这了,更多相关JavaScript中let和const用法区别内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！