如何在Javascript ES6中“隐藏”类名？

Question

我正在做一些香草与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模块功能，但我不知道如何。

Answer 1

您可以使用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模块不支持原生呢，所以你应该transpile代码使用Babel。如果您想在浏览器中运行代码，则可以使用Rollup.js将模块捆绑到一个文件中。

Answer 2

你是在正确的道路上，使用modules。

在你的情况下，你将有三个模块A，B和C。模块C将导入模块A和B。您的公共API将是模块C，阻止A和B类污染范围。

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

a.js

export default class A { 
    // ... 
} 

b.js

export default class B { 
    // ... 
} 

c.js

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

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