如何在Javascript ES6中「隱藏」類名？

我正在做一些香草與ES6的Javascript。我簡單的代碼在3個文件劃分是這樣的：如何在Javascript ES6中「隱藏」類名？

// 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模塊功能，但我不知道如何。

來源

2016-12-05 Thomas

*任何*模塊系統會有所幫助。無論如何，如果您已經使用了轉換器，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模塊不支持原生呢，所以你應該transpile代碼使用Babel。如果您想在瀏覽器中運行代碼，則可以使用Rollup.js將模塊捆綁到一個文件中。

來源

2016-12-05 15:42:21

你是在正確的道路上，使用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(); 
    } 
}

來源

2016-12-05 15:48:24

謝謝！但是，一旦我將c.js包含到我的html中，變量A和B是否仍然會污染範圍？ – Thomas

模塊工作方式可以防止這種情況發生。 A和B類不會在外面看到，因爲它們不會被導出。 –

@Thomas：瀏覽器不支持模塊。您必須使用將所有文件合併到一個文件中的模塊捆綁器。 –

如何在Javascript ES6中「隱藏」類名？

回答

相關問題