将属性/字段添加到数组答案

【问题标题】：Adding attribute/field to and array将属性/字段添加到数组
【发布时间】：2021-12-07 19:08:17
【问题描述】：

我正在开发一个 Angular 应用程序。我的数据如下。

data = [
{
  "sampleData": [{
    "id":"1"
  }],
  "status": "completed"
},
{
  "sampleData": [{
    "id":"1"
  }],
  "status": "not completed"
},
{
  "sampleData": [],
  "status": "completed"
}
]

上面是示例数组。像这样在运行时我的数组可以包含 200-300 条记录。我想根据以下条件为每个元素添加一个属性/字段“类别”。

如果样本数据的长度大于 0，则检查状态。如果状态已完成，则将添加属性/字段“类别”：“已完成”。如果状态未完成，则添加属性/字段“类别”：“未完成”。
如果样本数据的长度等于0，则将“category”：“on hold”属性/字段添加到数组中。

所以，上面的数组经过处理后应该如下所示：

data = [
{
  "sampleData": [{
    "id":"1"
  }],
  "status": "completed",
  "category": "completed"
},
{
  "sampleData": [{
    "id":"1"
  }],
  "status": "not completed"
  "category": "not completed"
},
{
  "sampleData": [],
  "status": "completed"
  "category": "on hole"
}
]

同样，我可以在运行时在一个数组中包含 200-300 个元素，我需要根据上述条件为每个元素添加类别并制作最终数组。我怎样才能以一种好的和有效的方式做到这一点？

【问题讨论】：

标签： javascript angular angular8 angular9

【解决方案1】：

遍历数组，检查item的sampleData属性长度是否大于0，如果是，则将item的category属性设置为item的status属性。否则，将其设置为“暂停”。

const data = [{
    "sampleData": [{
      "id": "1"
    }],
    "status": "completed",
  },
  {
    "sampleData": [{
      "id": "1"
    }],
    "status": "not completed"
  },
  {
    "sampleData": [],
    "status": "completed"
  }
]


data.forEach(e => e.category = e.sampleData.length > 0 ? e.status : "on hold")

console.log(data)

如果您不想使用Array.map改变原始版本，则可以实现相同的逻辑：

const data = [{
    "sampleData": [{
      "id": "1"
    }],
    "status": "completed",
  },
  {
    "sampleData": [{
      "id": "1"
    }],
    "status": "not completed"
  },
  {
    "sampleData": [],
    "status": "completed"
  }
]


const res = data.map(e => ({ ...e,
  category: e.sampleData.length > 0 ? e.status : "on hold"
}))

console.log(res)

使用if 语句 (as per OP's request)：

const data = [{
    "sampleData": [{
      "id": "1"
    }],
    "status": "completed",
  },
  {
    "sampleData": [{
      "id": "1"
    }],
    "status": "not completed"
  },
  {
    "sampleData": [],
    "status": "completed"
  }
]


data.forEach(e => e.category = e.sampleData.length > 0 ? e.status : "on hold")

console.log(data)

【讨论】：

能否请您也举个例子，我如何使用 if.. else if 为每个元素添加类似的属性。请保留上面的示例。我只是想尝试两种方式
@Rahul 我已经更新了我的答案。

【解决方案2】：

你可以使用Array.map():

function addCategory(source) {
  return source.map( item => ({
    ...item,
    category: item.sampleData.length === 0
      ? 'on hold'
      : item.status === 'completed'
      ? 'completed'
      : 'non completed';
  });
}
.
.
.
const withCategory = addCategory( getMeSomeSourceData() );

就这么简单。

【讨论】：