ES2015模块 - 如何动态命名导出

Question

我想创建一个名为h的模块，它为每个HTML元素导出一个函数。以下是它的使用方法：

import {div, p} from 'h'

const myDiv = div(p('some text'))

这是该模块的定义：

const h = {}
for (let tagName of ['div', 'p', /* ... */]) {
  h[tagName] = (...children) => {
    // ...
  }
}

export const div = h.div
export const p = h.p
/* ... */

我不喜欢必须明确列出每个导出项。如何使它们变得动态？

- Ashton Six

Answer 1

无法做到。 import 和 export 语句被设计为这样是因为它们必须能够在代码执行之前被静态分析，也就是说，导入和导出的名称必须在执行代码之前已知。如果您需要动态命名，则应继续使用当前的方法：导出一个“映射”（或对象）。人们仍然可以使用解构来获取他们想要的内容。

const {div} = h;

- Felix Kling

---

@MarkFox：动态的import()不是一个import语句。 - Bergi

@Bergi 确实，动态的 import() 表达式与静态的 import 语句是不同的……但是对于那些没有记住规范的人来说，这种晦涩的语义区别是否容易理解呢？我表示怀疑。在我看来，跳过“import”的提及并不会影响答案的简洁性。 - Mark Fox