ES6模块化作用域

328 阅读1分钟

在ES6模块化中,每个模块都有自己的作用域,变量和函数只在该模块内部可见,不会泄露到全局作用域中。因此,如果一个模块中定义了变量和类,类中的方法调用了该模块中的变量,那么这些变量的值不会受到其他模块的影响。

例如,假设我们有一个名为"module1"的模块,其中定义了一个变量"foo"和一个类"Bar",类中的方法调用了"foo"变量:

let foo = 0;

class Bar {
  constructor() {
    this.value = foo;
  }

  setValue(value) {
    foo = value;
  }
}

export default Bar;

在另一个模块中,我们可以使用"import"语句来引入"module1"模块,并创建"Bar"类的实例:

import Bar from "./module1.js";

const bar1 = new Bar();
const bar2 = new Bar();

console.log(bar1.value); // 输出 0
console.log(bar2.value); // 输出 0

bar1.setValue(1);

console.log(bar1.value); // 输出 1
console.log(bar2.value); // 输出 0

在这个例子中,module2模块创建了两个Bar类的实例bar1和bar2,它们都引用了module1模块中的foo变量。

当bar1调用setValue方法修改foo变量的值时,bar2的value属性不会受到影响,因为每个模块都有自己的作用域,变量和函数只在该模块内部可见,不会泄露到其他模块中。