前端中循环依赖

什么是循环依赖: 两个以上模块之间互相引用，构成闭环依赖。

保持依赖引入的单向流通性！

示例：
不要觉得自己不会写出这样的代码，当项目庞大后一旦出现这样的问题将会造成无法排查的问题。

// 在a.js 引用 b.js 内容
import {b} from "./b.js"
export const a = () => {
  omit...
}
// 在b.js 引用 a.js 内容
import {a} from "./a.js"
export const b = () => {
  omit...
}

1. 为什么循环依赖会造成报错

循环依赖产生之后报错的原因，通常是由模块执行顺序造成的。

1.1 执行顺序

执行的顺序导致的模块先后加载时，出现未定义未初始化的报错。

ES6 modules
在ES6模块中，模块的加载顺序是由它们在代码中的出现顺序决定的。因此，如果两个模块相互引用，那么先出现的模块将先执行。
CommonJS
在CommonJS模块中，模块的加载顺序是由require函数的调用顺序决定的。因此，如果两个模块相互引用，那么先调用require函数的模块将先执行。

1.2 ES6 和 CommonJS 输出的值是和原始值是什么关系？（修改导出的值是否会影响原始值）

CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。 -- 《ECMAScript 6 入门教程》

CommonJS 模块确实输出的是一个值的拷贝。当你使用 module.exports 导出一个值时，这个值是被复制的，而不是被引用的。这意味着，如果你导出一个对象，那么对这个对象的修改不会影响到其他模块。
ES6模块使用 export 关键字来导出值，并且默认情况下，这些值是被引用的，而不是被复制的。这意味着，如果你导出一个对象，那么对这个对象的修改会影响到其他模块。但是，有一种情况下，ES6模块会创建一个值的拷贝，那就是当你使用 export 导出一个函数或者类的时候。在这种情况下，函数或者类的代码会被复制，但是任何在函数或者类中引用的外部变量仍然会被引用。