如何"；隐藏“；Javascript ES6中的类名？

我正在用ES6编写一些普通的Javascript。我的简单代码分为3个文件，如下所示：

// File A
class A { 
    // ...
}

// File B
class B { 
    // ...
}

// File C
class C { 
    constructor() {
        this.a = new A();
        this.b = new B();
    }
}

类A和B只在类C中使用，所以我想“隐藏”这些类名，防止它们污染范围

---

如何将它们保存在不同的文件中？也许我应该使用ES6模块功能，但我不确定如何使用。

您可以使用ES6模块

在文件A和B中导出类：

// File A
export default class A { 
    // ...
}

// File B
export default class B { 
    // ...
}

并将其导入文件C中：

import A from './A';
import B from './B';

// File C
class C { 
    constructor() {
        this.a = new A();
        this.b = new B();
    }
}

---

不幸的是，ES6模块本机还不受支持，所以您应该使用。如果要在浏览器中运行代码，可以使用将模块捆绑到一个文件中。

如果路径正确，请使用

在您的情况下，您将有三个模块

A

、

B

和

C

。模块

C

将导入模块

A

和

B

。您的公共API将是模块

C

，防止

A

和

B

类污染范围

假设这些模块将在同一目录中，这将导致以下结构

a、 js

b、 js

c、 js

---

任何模块系统都会有所帮助。如果您已经使用了transpiler，ES6模块当然是一个不错的选择。谢谢！但是一旦我将c.js包含到我的html中，变量A和B是否仍然会污染范围？模块的工作方式阻止了这一点。类A和B在外部不可见，因为它们没有导出。@托马斯：浏览器不支持模块。您必须使用一个模块绑定器，它将所有文件合并到一个文件中。

export default class A { 
    // ...
}

export default class B { 
    // ...
}

import A from './a'
import B from './b'

export default class C { 
    constructor() {
        this.a = new A();
        this.b = new B();
    }
}