javascript - 生成DOM元素时可替代JavaScript `with`语句

说，我有一个JavaScript库来生成DOM片段，如下所示

<main>
  <h1>A heading</h1>
  <p>A paragraph</p>
</main>

其中的domlib库具有适用于任何类型元素的方法，并且生成上述片段的函数可能如下所示:

function(domlib){
  return domlib.main(
    domlib.h1('A heading'),
    domlib.p('A paragraph')
  );
}

在此函数中，我想调用domlib方法，如下所示:

main(
  h1('A heading'),
  p('A paragraph')
)

为此，我可以将domlib的所有方法放在全局范围内，但我宁愿避免污染全局范围。对我来说，这似乎是with语句将是理想解决方案的情况:

function(domlib){
  with(domlib){
    return main(
      h1('A heading'),
      p('A paragraph')
    );
  }
}

尽管仍然受支持，但the with statement is practically deprecated和will throw an error in strict mode。

除了将domlib方法分配给局部函数变量外，我没有看到很多其他选择，但是这很容易导致数十个局部变量的分配，在这种情况下，第一种方法(直接在domlib上调用方法)将导致代码更简单。

我的问题是，是否还有其他替代方法可以实现我想要的功能，其简单性和可读性与使用with语句类似？

最佳答案

我将使用的方法是通过分解显式列出我想要的元素。

例如，在您的情况下，我将具有以下内容:

const component = ({main, h1, p}) => main(
  h1('A heading'),
  p('A paragraph')
);

这类似于在做

const component = (domlib) => {
  const {main, h1, p} = domlib;
  return main(
    h1('A heading'),
    p('A paragraph')
  );
};