时间戳

首页 > 解决方案 > 结合属性速记和休息：{ type, which, selected: { ...selected, ...hovered } } ：这里发生了什么？

javascript - 结合属性速记和休息：{ type, which, selected: { ...selected, ...hovered } } ：这里发生了什么？

问题描述

编辑：对于所有说我需要提供背景信息的人：其中有答案。下面的两个变量 -type和which- 来自此表达式外部的源，并且通过传播创建的对象中的所有内容都分配给选定的。我在想以某种方式输入，并且从传播创建的对象中接收它们的值。不是这样！

我正在修改一位已离职的首席开发人员的代码，但遇到了一个我不明白的公式。

{ type, which, selected: { ...selected, ...hovered } }

从这段代码

export const renderSelector = createSelector(
  selectedTypeSelector,
  selectedSelector,
  hoveredSelector,
  (type, selected, hovered) => memoize(
    which => loadRender({ type, which, selected: { ...selected, ...hovered } }),
  ),
);

我已经相当仔细地研究过 ES6 特性，但不记得见过这个。我完全了解右侧的传播，但我不清楚左侧发生了什么。那就是：到底type, which, selected:做什么？我四处询问，向我解释说，上面左侧的字段名称:捕获由创建的对象中的匹配字段，并且如果存在不匹配的字段名称{ ...selected, ...hovered }，则将不匹配的字段放在一个数组中rest左边。有人可以指点我一个描述这个的链接吗？谢谢！

标签： javascriptecmascript-6

解决方案

表达方式

{ type, which, selected: { ...selected, ...hovered } }

几乎等于1

{
    "type": type,
    "which": which,
    "selected": Object.assign({}, selected, hovered)
}

其中type, which, selected, 和hovered是局部变量。换句话说，"type"and"which"使用属性简写指定，并且"selected"明确指定为selectedand的浅合并hovered。

1我说“几乎”是因为Object.assign触发了属性设置器，而...对象传播语法却没有。

推荐阅读