将属性从对象分配给 HTMLElement 的 es6/7 简写

Posted 2023-03-07

【中文标题】将属性从对象分配给 HTMLElement 的 es6/7 简写

【英文标题】：es6/7 shorthand for assigning properties from object to HTMLElement

【发布时间】：2021-08-30 09:35:10

【问题描述】：

以下内容的简写：

setupIframeConfig(element: htmlIFrameElement, config: IFrameConfig)
    element.src = config.src;
    element.width = config.width;
    element.width = config.width;

使用 rest 不会这样做，因为它会创建一个新对象而不是 HTML 元素引用。

element = ...element, ...config

认为可能是解构赋值，但用于声明变量。

这个案例的简写 es6/7 是什么？

【问题讨论】：

Object.keys(config).forEach(key=> element[key]=config[key]);

Object.assign(element, config) 这里应该够用了。

我有一个答案，您可以在其中将自定义函数附加到 HTMLElement 原型，该原型将遍历您的配置对象并在 HTMLElement 中设置这些属性，但Object.assign 似乎已经完成了像 @ 这样的工作提到了花费者。

【参考方案1】：

我假设您正在寻找最简洁的方法。

这很可能通过使用Object.assign 来实现：

Object.assign() 方法将所有可枚举的自身属性从一个或多个源对象复制到目标对象。

在你的情况下，目标对象是element，这里唯一的源对象是config：

Object.assign(element, config)