ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、视频、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
[toc] ### 1. let 有块级作用域, var 没有 ```js { var a = 10; let b = 20; } console.log(a); // 10 console.log(b); // b is not defined 报错 ``` ### 2. var 在同一个作用域中可以重复声明,let 不可以 ### 3. var 存在声明提前,let 不可以 ### 4. for 循环中的 var 与 let 1) for中var i会对外界产生影响 ``` for(var i=1; i<5; i++){ console.log(i); //1, 2, 3, 4 } console.log(i); //5 ``` for中let i的作用域仅限for循环内 ``` for(let i=1; i<5; i++){ console.log(i); //1, 2, 3, 4 } console.log(i); //i is not defined ``` 2) for中var i中会覆盖外界上层的声明 ```js var i = 3; for(let i=1; i<5; i++){ console.log(i); //1, 2, 3, 4 } console.log(i); //5 ``` 3) 用var声明的for循环会跳过点击事件,当点击事件执行的时候,i返回for循环最后得出的值 ``` <ul> <li>1</li> <li>2</li> <li>3</li> </ul> <script> var lis = document.getElementsByTagName("li"); for(var i=0; i<lis.length; i++){ lis[i].onclick = function(){ // lis[i].style.color = "red"; //无法执行,因为没有lis[3] //改成this.style.color = "red"可以执行 console.log(i); //i=3 } console.log(i); //0, 1, 2 } </script> ``` 4) let会正常执行 ``` var lis = document.getElementsByTagName("li"); for(let i=0; i<lis.length; i++){ lis[i].onclick = function(){ // lis[i].style.color = "red"; //可以正常执行, lis[i]返回点击的i值 console.log(i); } console.log(i); } ``` ``` var num1 = 55; var num2 = 66; function f1(num, num1) { num = 100; //此时传入的55变为100 num1 = 100; //此时传入的66变为100 num2 = 100; //该函数内没有num2,因此var num2 = 100覆盖了全局变量num2变为100 console.log(num); //100 console.log(num1); //100 console.log(num2); //100,只有外界的全局变量num2受到函数的影响 } f1(num1, num2); //传入55, 66 console.log(num1); //55 console.log(num2); //100 console.log(num); //报错,而不是undefined ```