《深入浅出ES6》读书笔记1

第八章 迭代器与生成器

  • 生成器函数会在每个yield语句后停止执行

  • 可以使用函数表达式创建一个生成器,只要再function关键字和圆括号之间使用一个星号(*)即可

    1
    2
    3
    4
    5
    6
    7
    let createIterator=function *(items){
    for(let i=0;i<items.length;i++){
    yield items[i];
    }
    };
    let iterator=createIterator([1,2,3]);
    console.log(iterator.next());
  • Symbol.iterator():访问对象上的默认迭代器,也可以用于创建自定义的可迭代对象

  • entries():返回一个包含键值对的迭代器

  • values():返回一个包含集合中的值的迭代器

  • keys():返回一个包含集合中键的迭代器

  • values是数组与Set的默认迭代器,entries()是Map的默认迭代器

异步任务运行

  • yield能停止运行,并在重新开始运行前等待next()方法被调用,可以在没有回调函数的情况下实现异步调用。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    function run(taskDef){
    // 根据传入的生成器,创建迭代器
    let task=tsakDef();
    // 保存执行迭代器之后的值
    let result=task.next();
    function step(){
    if(!result.done){
    // 每次调用next()就把返回的结果保存在result上
    result=task.next();
    step();
    }
    }
    step();
    }
    // 生成器
    run(function*()){
    console.log(1);
    yield;
    console.log(2);
    yield;
    console.log(3);
    }

第九章 JS的类

:warning: ES5不存在类,会创建一个构造器,然后将方法指派到该构造器的原型上。ES6中新增了类。

  • 类声明,外部绑定和内部绑定有着相同的名称
  • 类表达式,外部绑定和内部绑定可以有不同的名称
  • 能被当做值来使用的就统称为一级公民,意味着它能作为参数传给函数、能作为函数返回值、能用来给变量赋值
  • Symbol.species被用于定义一个能返回函数的静态访问器属性。
  • 可以使用new.target创建一个抽象基类(一种不能被实例化的类)

第十章 增强的数组功能

:warning:ES5中创建数组有两种方式:Array构造器和数组字面量写法,在书写时需要将数组项别分别列出,且”类数组对象”转换为数组并不自由。ES6新增Array.of()和Array.from()方法

  • Array.of():创建一个包含所有传入参数的数组
  • Array.form():传入可迭代对象或者类数组对象,能返回一个数组
  • fill(特定数值,起始位置,结束未知):使用特定值填充数组中的一个或多个元素
  • copyWithin(填充起始位置,复制起始位置,复制结束位置):在数组内部复制自身元素
  • new ArrayBuffer():创建内存中包含一定数量字节的区域
  • new DataView():创建数组缓冲区的通用视图
  • ES6的类型化数组实际上也是针对数组缓冲区的特定类型视图,截图使用这些数组对象来处理特定的数据类型,而不必使用通用的DataView对象。
  • 类型化数组与常规数组的比较:
    • 可以使用length属性获取类型化数组包含的元素数量,但是不能通过length属性修改数组的长度
    • 可以通过数值类型的索引值直接访问类型化数组的元素
    • 类型化数组的方法会进行额外的类型检查以确保安全,并且返回值会是某种类型化数组
    • 类型化数组不是从Array对象派生的,使用Array.isArray()检测会返回false
    • 常规数组可以被伸展或是收缩,然而类型数组会保持自身大小不变

第十一章 Promise与异步编程

:warning:ES5中会存在回调地狱问题,ES6提出Promise

  • Promise的catch()方法,等同于只传递拒绝处理函数给then()
  • 创建未决的Promise:新的Promise使用promise构造器创建,接受单个参数:一个被称为执行器的函数,包含初始化Promise的代码,该函数传递resolve()和reject()
  • 创建已决的Promise:
    • Promise.resolve()接受单个参数并会返回一个处于完成态的Promise
    • Promise.reject()
  • 所有的Promise都是Thenable,但并不是所有的Thenable都是Promise
  • 全局的Promise拒绝处理:当一个Promise被拒绝时若缺少拒绝处理函数,就会静默失败
  • Node.js和浏览器的拒绝处理:process对象上存在两个时间:unhandledRejection和rejectHandled
  • promise.all():接收单个可迭代对象作为参数,并返回一个Promise
  • promise.race():接收单个可迭代对象作为参数,并返回一个Promise。但是一旦来源Promise中有一个被解决,所返回的Promise就会立刻被解决。

第十二章 代理与反射接口

:warning:ES5的特定对象(例如数组)会显示出一些非常规的行为,代理的出现改变了这种情况,代理允许你为一些JS底层操作自定义常规行为。

  • 反射接口允许开发者为每个代理陷阱实现默认的行为
  • 每个代理陷阱在Reflect对象上都有一个同名的对应方法。

第十三章 用模块封装代码

  • 模块是使用不同方式加载的JS文件
  • ES6的import语句为变量、函数与类创建了只读绑定,外部模块导入的变量会始终反应导入变量的变化
  • default指默认导出,导出内容并不需要有名称,代表该模块本身。
  • 导入默认值不需要加花括号,导入非默认值需要加花括号。默认名称要位于非默认名称之前。