「这是我参与2022首次更文挑战的第4天，活动详情查看：2022首次更文挑战」
写在前头
大多数小伙伴看技术书籍都会用“啃”来描述读书的直观感受，当然我也是一个前端小白，白的透明那种，但是我在读技术书籍感觉到“啃”的时候，我希望把我啃红宝书第四版的过程的想法，总结带给大家，以供后来者能够更快上手。
注： 本文由于作者水平原因，如有错误之处，恳请大家指正,另外随着学习的深入，体会的加深，我会不断回来更新，修改这类文章。
思维导图
image.png
脉络 （本篇只包含3.3. 变量之3.3.1var关键词）
这小节其实核心就是介绍了var，let，const 这3个变量的关键字，以及平时的声明风格，实践。
本篇开始继续介绍之后的内容
3.3. 变量
image.png
3.3.2let
- let与var的区别
① 声明范围
上文写到var关键词声明的是包含var关键词的那个函数作用域，而let关键词的作用域则是块作用域。
什么是块作用域，简单来说就是一个{}里面包含了let关键词，他就在这个{}里面起作用。其他地方无效。
②冗余声明
和var不同，var是运行多次声明同一个变量，但是let只能声明一次变量
var age;
var age; // 不会报错
let age;
let age; // 会报错，使用let重复声明name变量
补充：var和let可以混合使用，但是不能一起声明一个变量
var age;
let age; // 会报错，使用let重复声明name变量
③声明提升
和var不同的是，let不会声明提升到作用域顶部。
也就是说let声明的变量，在未声明之前使用就会报错。
alert(name); // 会报错，因为let声明变量在后面。
let name = '张三';
- 暂时性死区
用人话来说就是，你知道你儿子要出生了，但是你没有办法抱他，亲他。你在考四级时，知道后面的有阅读题，但是你必须听完听力才可以做，你在听听力期间，就是不允许去看阅读题。简单就是，你知道后面的变量声明，但是你还是没有办法调用他。
- 全局声明
这里涉及到全局作用域，在看红宝书的时候就简单理解为，var声明的变量，可以成为对应的window对象属性。
let age = 1;
console.log(window.age); // undefined
var age = 1;
console.log(window.age); // 1
- 条件声明
书中讲到了使用try，catch，if语句等等来检测代码之前是否已经声明了这个变量。
但是这些都是徒劳，为什么? 因为我们知道let的作用域（文章开头说了） 是块级作用域。
那么在检查到如果上文代码中没有声明该变量，后面在catch块里面，if语句块，里面使用let声明的变量，它的作用域就是catch块里面，if语句块里面，无法跳到更大的作用域。所以对let关键词，条件声明是没有意义的。
- for 循环
渗透问题 for循环里需要注意的是let和var变量的作用域
迭代变量的奇特声明和修改 还有就是每一次循环之后，var声明的迭代变量就会迭代，但是let声明的迭代变量就会及时更新变量（声明一个新的迭代变量）。
注意：书中的setTimeout(() => console.log(i), 0); 是异步执行的，如果使用的是var声明变量i，确实就是等for循环结束后，在执行这句话，也就是说会输出5个5。
for (var i = 0; i < 5; i++ ){
console.log(i); // 输出0,1,2,3,4 不是异步执行的
}
3.3.3const
- const和let的区别
①初始化
首先const关键词在声明变量的同时一定要赋值，而且在赋值之后在也无法改变。
const i = 1; // i 永远就是1了，是一个常量了
②for循环
在for循环中依然要坚持const只能声明常量的事实，换句话来说就是const不能声明迭代变量。但是要是for循环里面需要使用一个常量，那么使用const关键词来声明在合适不过。、
for (const i = 1; i < 10; i++) // 报错
for (let i = 1; i < 10; i++) {
const name = '张三';
console.log(name); //不会报错
}
- const声明的限制（ ②③④同let一样）
①修改变量值 记住const声明的是常量
②重复声明
③作用域
④限制目标 （const声明变量引用的对象是不可以修改的，但是该对象的属性是可以修改的）
3.3.4声明风格与最佳实践
一句话，尽量不使用var，const 优先，let 次之。书中也介绍了为什么这样使用的理由，我就不班门弄斧介绍啦。
网友评论