let 关键字
1.变量不能重复声明
let star = 'myself' let star = 'you'
会报 Identifier 'star' has already been declared 的错误
2.块级作用域
{ let star = 'myself' } console.log(star)
会报 star is not defined 的错误
3.不存在变量提升
console.log(myself) let myself = '前端开发者'
会报Cannot access 'myself' before initialization 的错误
4.不影响作用域链
let num = 20 function fn() { console.log(num) }
在上述代码中,fn(函数内访问了num变量,由于fn((函数内部不存在num变量，所以向上级作用域中查找) 找到了全局作用域,此时num的值就是全局作用域下的20)
**作用域链:**当在一个函数内部声明另一一个函数时，就会出现函数嵌套的效果。当函数嵌套时，内层函数只能在外层函数作用域内执行，在内层函数执行的过程中，若需要引人某个变量，首先会在当前作用域中寻找，若未找到，则继续向上一层级的作用域中寻找，直到全局作用域。我们称这种链式的查询关系为作用域链。
let 案例
- let 案例：点击div框，切换颜色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>let实践</title> <style> .item{ width:90px; height: 40px; display: inline-block; border: 2px lightblue solid; } </style> </head> <body> <div class="container"> <h2 class="page-header">点击切换颜色</h2><hr/> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div> <script> //获取div元素对象 let items = document.getElementsByClassName('item') //遍历并绑定事件 for(let i=0;i<items.length;i++){ items[i].onclick = function() { //修改当前元素的背景颜色 items[i].style.background = 'pink' //var声明时不可用 //this.style.background = 'pink' //var和let声明均可用 } } </script> </body> </html>
如果使用 var 声明, 再使用 items[i].style.background = 'pink' 修改背景颜色, 则此时的 i 为 3,没有这个div块,会报 Cannot read properties of undefined (reading 'style') [ 无法读取未定义的属性（读取“样式”）] 的错误
for循环中 var 和 let 的区别:
var 命令的存在变量提升，var 命令实际只会执行一次。而 let 命令不存在变量提升，所以每次循环都会执行一次，声明一个新变量（但初始化的值不一样）。for 的每次循环都是不同的块级作用域，let 声明的变量是块级作用域的，所以也不存在重复声明的问题。let 声明变量的for循环里，每个匿名函数实际上引用的都是一个新的变量。
const 关键字
const 用于声明 常量
1.一定要赋初始值
const A
会报 Missing initializer in const declaration(常量声明中缺少初始值设定项) 错误
2.一般常量使用大写(潜规则),小写也不会报错
const A = 100 const b = 200
3.常量的值不能修改
const A = 100 A = 200
会报 Assignment to constant variable.(Assignment to constant variable.赋值给常数变量) 的错误
4.块级作用域
{ const PLAYER = 'UZI' } console.log(PLAYER);
5.对于数组和对象的元素修改，不算做对常量的修改，不会报错
const TEAM = ['Lan','Kai','Jing'] TEAM.push('Yao')
不积跬步无以至千里 不积小流无以成江海
