timetravelcyn/es6

深入理解ES6读书笔记

Hi there, I'm cyn 👋

• 🌱 do better

🔭 Goals of 2023

• 300🌟 repo x 1.（0/1）
• Become member of vite&parcel.（0/2）
• 10 blog. (0/10)
• 150 followers.（88/150）
• learn Rust. (0/1)

Languages and Tools:

es6's Issues

2.字符串和正则表达式

有关Unicode

---

ps：这部分其实看的比较乱，对于Unicode编码也没有什么太大的感触，所以记录为主。

ES6出现以前，JavaScript字符串一直基于16位字符编码进行构建。每16位的序列是一个编码单元，代表一个字符。length、charAt()等字符串属性和方法都是基于这种编码单元构造的。且在过去，16位足以包含任何字符，知道Unicode引入扩展字符集，编码规范不得不进行变更。

UTF-16码位

Unicode有个牛逼的目标，为全世界每一个字符提供全球唯一的标识符。
在UTF-16中，前2的16次方个码位均以16位的编码单元表示，这个范围被称为 基本多文种平面。

3.函数

1.块级作用域绑定

let与const声明

• 不存在变量提升
• 不允许重复声明
• 产生了一个叫TDZ(临时死区)的东东~

临时死区

---

与var不同，let和const声明的变量不会被提升到作用域顶部，如果在声明之前访问这些变量，即使是相对安全的typeof操作符也会触发引用错误。

if (condition) {
  console.log(typeof value); //引用错误.
  let value = 'blue'
}

JavaScript引擎在扫描代码发现变量生命是，要么将他们提升至作用域顶部(遇到var声明，变量提升),要么将声明放到TDZ中(遇到let和const声明).访问TDZ中的变量会触发运行时的错误。只有执行过赋值语句后，变量才会从TDZ中移出，方可正常访问。相对安全的typeof操作符也无法阻挡引擎抛出错误(为什么相对安全，下回分解~).

console.log(typeof value) // 'undefined'
if (condition) {
  let value = 'blue'
}

此处不会报错是因为typeof是在块级作用域外进行的，此时TDZ中并没有value，所以不会抛错。

TDZ只是块级绑定的特色之一，而在循环中使用块级绑定也是一个特色。

循环中的块作用域绑定

---

说起此事，首先想到的就是各大面试题中会出现的那道经典的闭包面试题了。这里不再赘述，解决的方法有IIFE等方法。
‘开发者可能最希望实现for循环的块级作用域了，因为可以把随意声明的计数器变量限制在循环内部。’

var funcs = []

for (let i = 0; i < 10; i++) {
    funcs.push(function () {
       console.log(i)
    })
}

funcs.forEach(function (func) {
    func(); //输出0,然后是1,2， 直到9
})

let声明在循环内部的行为是标准中专门定义的，它不一定与let的不提升特性相关，理解这一点至关重要。事实上，早期的let实现不包含这一行为，是后来加入的。

对于const声明，看以下一段例子。

var funcs = [];
// 完成一次迭代后抛出错误
for(const i = 0; i < 10; i++) {
    funcs.push(function () {
        console.log(i)
    })
}

是因为const变量是不可被修改的！！！
for-in与for-of循环中使用const的行为和let一致。

var funcs = [].
      object = {
          a: true,
          b: true,
          c: true,
      }

for(const key in object) {
    funcs.push(function() {
        console.log(key);
    })
}
funcs.forEach(function (func) {
    func();
})

之所以不会报错是因为for-in和for-of循环中，每次迭代不会修改已有绑定，而是会创建一个新的绑定。

全局块作用域绑定

---

var RegExp = 'Hello!';
console.log(window.RegExp) // 'Hello!'

var定义的全部变量会最终成为window的属性。

如果你在全局作用于中使用let和const，会在全局作用域下创建一个新的绑定，但该绑定不会添加为全局对象的属性。即不会覆盖全局变量，只会遮蔽它

let RegExp = 'Hello!';
console.log(window.RegExp === RegExp) // false
console.log(RegExp in window) // false

最佳实践

---

默认使用const，只在确实需要改变变量的值时使用let。这样就可以在某种程度上实现代码的不可变，从而防止某些不可预料的错误。

好文赏析

我花了两个月才理解的let