JavaScript基于已有对象创建新对象时的payment字段赋值问题

这场景我之前做发票系统时刚好遇到过，其实不用写复杂的三元表达式嵌套整个对象，用解构赋值+简单条件判断就能轻松搞定，代码还很清爽。

核心思路 #

• 原对象的invoice.pdf字段值直接保留
• 针对invoice.payment做分支处理：
  • 若是null（对应变体1），新对象里payment保持为null
  • 若是对象（对应变体2），只提取你需要的指定字段（比如status）

代码实现 #

基础版（直接判断）

// 替换成你的变体1或变体2对象
const existing_obj = { invoice: { pdf: 'string', payment: { id: 'string', status: 'success' } } };

const newObj = {
  invoice: {
    pdf: existing_obj.invoice.pdf,
    // 利用JS真值判断：null会走else分支，对象则提取指定字段
    payment: existing_obj.invoice.payment 
      ? { status: existing_obj.invoice.payment.status } 
      : null
  }
};

优化版（解构赋值提升可读性）

如果原对象层级较深，先解构出需要的字段会让代码更清晰：

const { invoice: { pdf, payment } } = existing_obj;

const newObj = {
  invoice: {
    pdf,
    payment: payment ? { status: payment.status } : null
  }
};

多字段提取扩展

如果需要提取多个字段（比如同时要id和status），可以单独处理payment部分，后续调整字段更方便：

const { invoice: { pdf, payment } } = existing_obj;

let processedPayment = null;
if (payment) {
  // 这里按需添加/删除需要提取的字段
  const { id, status } = payment;
  processedPayment = { id, status };
}

const newObj = {
  invoice: {
    pdf,
    payment: processedPayment
  }
};

这样不管是变体1还是变体2，都能完美生成你想要的新对象，而且代码维护起来也很方便～

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