JavaScript中如何根据条件按需向JSON添加数据并优化代码？

优化你当前的扩展运算符写法 #

你当前用扩展运算符的思路是可行的，我们可以做些小优化：把null换成undefined（或直接利用逻辑与的短路特性），因为对象扩展运算符遇到undefined、null或布尔值都会直接忽略，代码更简洁语义也更清晰：

const condition2 = false;
const condition3 = true;
const condition4 = false;

const json = {
    item1: "test1",
    ...(condition2 && { item2: "test2" }),
    ...(condition3 && { item3: "test3" }),
    ...(condition4 && { item4: "test4" })
};
// 结果: { item1: "test1", item3: "test3" }

这里利用了逻辑与&&的短路特性：当条件为false时，表达式返回false，扩展运算符会直接忽略；条件为true时，才会展开后面的对象。

批量处理多条件场景（适合大量属性） #

如果需要处理十几个甚至更多条件属性，单独写扩展运算符会冗余。可以把所有条件与属性的对应规则集中到数组里，再批量处理：

const condition2 = false;
const condition3 = true;
const condition4 = false;

// 集中定义规则：每一项是 [条件, 属性键, 属性值]
const conditionalProps = [
    [condition2, 'item2', 'test2'],
    [condition3, 'item3', 'test3'],
    [condition4, 'item4', 'test4']
];

const json = Object.assign(
    { item1: "test1" },
    ...conditionalProps.filter(([cond]) => cond).map(([_, key, value]) => ({ [key]: value }))
);

这种方式把所有规则放在一处，后期修改或新增属性时，只需要在数组里添加一行即可，可读性和维护性更强。

利用Object.fromEntries（ES2019+） #

还有一种更紧凑的批量处理方式，用Object.fromEntries把键值对数组直接转成对象：

const condition2 = false;
const condition3 = true;
const condition4 = false;

const conditionalEntries = [
    condition2 && ['item2', 'test2'],
    condition3 && ['item3', 'test3'],
    condition4 && ['item4', 'test4']
].filter(Boolean); // 过滤掉无效的false项

const json = {
    item1: "test1",
    ...Object.fromEntries(conditionalEntries)
};

先生成带条件判断的键值对数组，过滤无效项后转成对象再扩展进去，代码简洁且逻辑清晰。

注意事项 #

• 以上方案需要运行环境支持对应ES版本（扩展运算符需ES2015+，Object.fromEntries需ES2019+），兼容旧环境可通过Babel转译。
• 如果属性值本身可能是 falsy 值（比如0、''、null），不要用condition && { key: value }的写法——此时即使条件为true，表达式也会返回falsy值导致属性被忽略，这种情况改用三元运算符condition ? { key: value } : undefined即可。

内容的提问来源于stack exchange，提问作者Shin