20200423

@xiaojingzhao

Plan

  • 你不知道的 js -- 代码组织

Notes

生成器 -- Transpile

思路：

用 swich 语句来分隔不同的步骤，并内部标记当前的 step

生成器的使用

  • 产生一系列值
  • 顺序执行任务队列

模块

😵

  • UMD
  • CMD
  • AMD
  • CommonJS
  • esm

ES6 模块

  • 新关键字
import xxx from "xxx";

export var test = "test";

var m1 = "module";

export { m1 };

// 或者
export { m1, test };

// 重命名
export { m1 as m2 };

// 以上都为命名导出 -- 名称绑定

  • 模块的导入不是值的复制，而是指向这个模块的一个指针/引用

  • 默认导出

export default xxx; // 一个模块只能有一个默认导出
export { xxx as default };

注意 这两种形式存在差异

export default xxx;

导出的是一个表达式。表达式是立即求值的，所以之后再修改这个导出的值，模块导入还是得到原来的值

export { xxx as default };

导出的是一个标识符，之后再修改 xxx，导入模块得到的是修改后的 xxx。

下面这个例子更加简单明了一些：

export default 1;

// export {1 as default} // 语法错误 -- 因为1不是标识符

提供了另一个一个简单的例子作为参考。

More

  1. 这周看一下 babel 转义 async/await 后的代码。
  2. 为什么export default xxx 是表达式，而 export {xxx as default} 是标识符。