讨论下关于 let 的那些事

推荐关注

› Meteor

› JSLint - a JavaScript code quality tool

› jsFiddle

› D3.js

› WebStorm

推荐书目

› JavaScript 权威指南第 5 版

› Closure: The Definitive Guide

This topic created in 2315 days ago, the information mentioned may be changed or developed.

据大家所知

for (let i = 0; i < 2; i++) {
	console.log(i);
	for (i = 0; i < 8; i++) {
		console.log('>'+i);
	}
}

结果是

0
>0
>1
>2
>3
>4
>5
>6
>7

而

for (let i = 0; i < 2; i++) {
	console.log(i);
	for (let i = 0; i < 8; i++) {
		console.log('>'+i);
	}
}

结果是

0
>0
>1
>2
>3
>4
>5
>6
>7
1
>0
>1
>2
>3
>4
>5
>6
>7

而

第二个 for 的 let 发生了什么😉

4 replies • 2020-02-06 14:52:47 +08:00

rabbbit

Feb 3, 2020

把 for 后面那个括号当成是个作用域
第一个
let i = 0;
while(i < 2) {
....console.log(i);
....{
........i = 0; // 注意这里
........while(i < 8) {
............console.log('>'+ i)
............i++
........}
....}
....i++
}

第二个
let i = 0;
while(i < 2) {
....console.log(i);
....{
........let i = 0;
........while(i < 8) {
............console.log('>'+ i)
............i++
........}
....}
....i++
}

optional

Feb 3, 2020

let 是块级作用域。第二个发生了变量覆盖。

royzxq

Feb 4, 2020

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let

Pichai

Feb 6, 2020

```
for (let i = 0; i < 2; i++) {
console.log(i);
for (i = 0; i < 8; i++) { 此处没有使用关键字进行变量声明，i 就是全局作用域
console.log('>'+i);
}
}
代码相当于:

var i; // i 提升到所有代码最上方

for (let i = 0; i < 2; i++) {
console.log(i);
for (i = 0; i < 8; i++) {
console.log('>'+i);
}
}

for (let i = 0; i < 2; i++) {
console.log(i);
for (var i = 0; i < 8; i++) { //此处使用 var 进行变量声明，i 变量提升到块级外
console.log('>'+i);
}
}
代码相当于
for (let i = 0; i < 2; i++) {
var i; //此时代码变量提升到 for 的大括号外，出现重复定义。let 不允许变量重复
console.log(i);
for (i = 0; i < 8; i++) {
console.log('>'+i);
}
}

```