将解构的值从一个数组推送到另一个数组答案

【问题标题】：Push destructured values from one array to another将解构的值从一个数组推送到另一个数组
【发布时间】：2021-06-20 09:33:00
【问题描述】：

我对@987654321@ 方法有点坚持，并且真的不知道如何正确实现它。目标是映射以下对象（假设它称为attribues）并将attribute_label 值放入一个新数组中。检查此值以避免空值也很重要。结果应该是一个新的数组，充满了字符串值：

{
    "size": {
        "attribute_label": "Size",
        "code": null
    },
    "color": {
        "attribute_label": "Color",
        "code": 24
    },
    "material": {
        "attribute_label": "Material",
        "code": null
    }
}

【问题讨论】：

您尝试了哪些方法来实现这一目标？
'检查此值以避免空值也很重要' ...您的意思是检查属性标签不为空或代码属性不为空，如您的示例所示？

标签： javascript arrays reactjs sorting ecmascript-6

【解决方案1】：

我在这里打死马，但这是我的解决方案，与其他人的非常相似：

const data = {
  size: {
    attribute_label: 'Size',
    code: null,
  },
  color: {
    attribute_label: 'Color',
    code: 24,
  },
  material: {
    attribute_label: 'Material',
    code: null,
  },
};

const result = Object.values(data)
  .map(value => value.attribute_label)
  .filter(label => label !== null);

【讨论】：

【解决方案2】：

您可以使用 Object.values 和 forEach 来推入标签数组

const attributes_labels = []
Object.values(attributes).forEach(attribute => {
   if (attribute.attribute_label) {
     attributes_labels.push(attribute.attribute_label);
   }
  })

【讨论】：

【解决方案3】：

你可以使用Object.values 来创建一个带有Object 内容的Array，然后映射这些值以仅提取attribute_label 属性，最后过滤Array 以跳过null 值：

const data = {
  "size": {
    "attribute_label": "Size",
    "code": null
  },
  "color": {
    "attribute_label": "Color",
    "code": 24
  },
  "material": {
    "attribute_label": "Material",
    "code": null
  }
};

const values = Object.values(data);
const attributeLabels = values.map(value => value.attribute_label);
const withoutNulls = attributeLabels.filter(label => label !== null);

console.log(withoutNulls)

【讨论】：

【解决方案4】：

您可以使用Object.values 从对象中获取值：

const attributes = {
  size: {
    attribute_label: "Size",
    code: null,
  },
  color: {
    attribute_label: "Color",
    code: 24,
  },
  material: {
    attribute_label: "Material",
    code: null,
  },
};

const labels = Object.values(attributes)
  .filter((val) => val !== null) // filter out null values
  .map(({ attribute_label }) => attribute_label);

console.log(labels);
// ["Size", "Color", "Material"]

如果attribute_value 本身可以是null（而不是对象中的值），只需在末尾添加另一个.filter()。

const attributes = {
  size: {
    attribute_label: "Size",
    code: null,
  },
  color: {
    attribute_label: "Color",
    code: 24,
  },
  material: {
    attribute_label: "Material",
    code: null,
  },
  another: null,
  another_attribute: {
    attribute_label: null,
    code: null,
  },
};

const labels = Object.values(attributes)
  .filter((val) => val !== null) // filter out null values
  .map(({ attribute_label }) => attribute_label)
  .filter((label) => label !== null); // filter out null labels inside the object

console.log(labels);
// ["Size", "Color", "Material"]

【讨论】：