let变量声明和声明特性

Adios丶

于 2021-10-14 14:28:56 发布

阅读量186

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/qq_43505828/article/details/120762953

版权

javascript 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了JavaScript中let关键字的特性，包括不允许变量重复声明、作用于块级作用域、无变量提升以及不污染全局作用域。通过示例展示了在for循环中使用let如何避免闭包问题，确保每个点击事件处理函数访问到的是局部作用域中的变量，防止意外的变量共享。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.变量不能重复声明

<script>
	let n = 1;
	let n = 2;
	console.log(n); // Identifier 'n' has already been declared
</script>

2.作用于块级作用域

{
    let n = 1;
}
    console.log(n); // n is not defined

3.没有变量提升

cosole.log(n); //  Cannot access 'n' before initialization
let n = 1;

4.不影响作用域链

let n = 1;
function fn() {
    console.log(n);
}
fn(); // 1

案例:

<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
<script>
	let items = document.querySelectorAll('div');
	for(let i = 0; i < items.length; i++) {
		items[i].onclick = function() {
			this.style.backgroundColor = 'skyblue';
		}
	}
</script>

循环每次访问到的变量i实际上都是同一个变量，onclick是一个异步任务（回调函数）,for循环是同步任务，因此需要在for循环结束后才能执行onclick,此时访问到的i等于3，超出的items的下标范围。

let定义了一个块级变量，在for循环中使用let定义的变量，作用域只在for循环中。因为每次循环都创建一个块级作用域，并且存上i的值，这里面的let定义的i值就是局部变量,所以每次循环改变的就是对局部变量赋值