es6 导入副作用的含义
MDN 上的 es6 导入语句参考。语法:
代码语言:javascript复制import "my-module";
将仅为副作用导入整个模块,而不导入任何绑定。
当您需要导入不导出任何内容但会执行其他操作的内容时,这是一个只有副作用的模块。您导入它只是为了初始化它。
纯模块和非纯模块
如果您将模块视为函数,那么仅通过导出其内容来影响范围的模块就像一个始终返回相同内容的函数(没有参数的纯函数)。无论你导入 react 15.01 多少次,你总会得到一个包含相同方法的对象。
具有副作用的模块是以其他方式更改范围然后返回某些内容的模块,其效果并不总是可预测的,并且可能会受到外部力量(非纯函数)的影响。例如,polyfill 可能不会做任何事情,因为它发现浏览器已经支持它启用的功能。
副作用举例:
- Angular 绑定到全局
window
对象,但不导出任何内容。 - 在不支持它们的浏览器中启用 ES6 功能的 polyfill,例如babel polyfill是一种副作用。
- 许多 jQuery 插件将自己附加到全局 jQuery 对象。
- 在后台运行、监控用户交互并将数据发送到服务器的分析模块。
- 如果您不使用 CSS 模块,则在 webpack 中导入 CSS 可以被视为副作用。
下面是一个例子:
代码语言:javascript复制//a.js
function print1()
{
console.log("export print1 is working");
}
function print2()
{
console.log("non-export print2 is working");
}
print1();
print2();
//b.js
import "a.js";
当您运行“b.js”时,您将看到打印的消息,称为side effects
.当您尝试导入某些内容时,它不会导出任何内容,但会执行许多操作并覆盖您现有的代码(如果有),因此这就是副作用。