在javascript中编写带有条件的扩展运算符的更好方法答案

【问题标题】：Better way to write spread operator with conditions in javascript在javascript中编写带有条件的扩展运算符的更好方法
【发布时间】：2020-11-18 05:42:55
【问题描述】：

我正在寻找更好的方法来编写以下代码：

let fromCreatedAt;
let toCreatedAt = new Date();

const someObject = {
    ...((!!fromCreatedAt || !!toCreatedAt) ? {
        createdAt: {
            ...(!!fromCreatedAt ? {
                from: fromCreatedAt,
            } : {}),
            ...(!!toCreatedAt ? {
                to: toCreatedAt,
            } : {}),
        },
    } : {}),
}

console.log(someObject); // { createdAt: { to: 2020-11-18T05:32:57.697Z } }

fromCreatedAt 和 toCreatedAt 是可以改变并生成不同对象的变量。

这只是一个示例，但您可以拥有一个对象，它为其他字段多次重复 createdAt 字段的条件，因此您会找到一种方法来重构重复的功能。

【问题讨论】：

标签： javascript object conditional-statements spread

【解决方案1】：

您可以使用shorthand property name 创建对象并有条件地传播它

let fromCreatedAt,
    toCreatedAt = new Date(),
    from = fromCreatedAt,
    to = toCreatedAt;

const createdAt = {
      ...(from && { from }),
      ...(to && { to })
    },
    someObject = {
      ...(from || to && { createdAt })
    }

console.log(someObject)

【讨论】：

【解决方案2】：

我会使用速记属性来创建createdAt 嵌套对象，通过过滤Object.fromEntries 来删除未定义的值。然后您可以根据createdAt 对象是否有任何键来创建someObject：

let from;
let to = new Date();
const createdAt = Object.fromEntries(
  Object.entries({ from, to }).filter(([, val]) => val !== undefined)
);

const someObject = Object.keys(createdAt).length
  ? { createdAt }
  : {};
  
console.log(someObject);

【讨论】：

【解决方案3】：

因为...null 和...undefined 将导致没有数据属性被复制，您可以去掉三元运算符并简化为布尔短路评估：

let fromCreatedAt;
let toCreatedAt = new Date();

const someObject = {
  ...(fromCreatedAt || toCreatedAt) && {
    createdAt: {
      ...fromCreatedAt && { from: fromCreatedAt},
      ...toCreatedAt && { to: toCreatedAt},
    }
  }
};

console.log(someObject);

我认为这可能会更优雅一点，但它并没有摆脱重复的条件，所以可能没有完全回答这个问题。

【讨论】：