ES6导入副作用含义



我正在阅读MDN上的es6导入语句参考。语法:

import "my-module";

将仅导入整个模块以产生副作用,而不导入任何绑定。我不确定副作用是什么意思。我一直在通过说import "angular"来使用角度.Angular 绑定到窗口,但不返回对象。所以我不确定这是否会被称为副作用。

当您需要导入不导出任何内容但执行其他操作的内容时,这是一个仅副作用模块。导入它只是为了初始化它。

纯模块和非纯模块

如果您将模块视为函数,则仅通过导出其内容来影响范围的模块就像始终返回相同内容的函数(没有参数的纯函数)。无论您导入 react 15.01 多少次,您都会得到一个包含相同方法的对象。

具有副作用的模块是以其他方式更改范围然后返回某些内容的模块,它的效果并不总是可预测的,并且可能受到外部力量(非纯函数)的影响。例如,polyfill 可能不会执行任何操作,因为它发现浏览器已支持它启用的功能。

副作用示例:

  • Angular 绑定到全局window对象,但不导出 什么。
  • 在浏览器中启用 ES6 功能的填充代码,但不支持 支持他们,就像 Babel Polyfill 是一种副作用。
  • 许多 jQuery 插件将自身附加到全局 jQuery 对象。
  • 在后台运行、监视用户交互并将数据发送到服务器的分析模块。
  • 如果您不使用 CSS 模块,在 webpack 中导入 CSS 可能会被视为一种副作用。

下面是一个示例:

//a.js
export 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

将下面作为示例代码。 当你尝试导入一些东西时,它不会导出任何东西,但会做很多事情并覆盖你现有的代码(如果有的话),所以这就是副作用。

import Ember from 'ember';
Ember.RSVP.configure('onerror', function(error) {
....
});

应用.js:

import './overrides/extra';

最新更新