如何映射对象的属性以获取数据项数组，其中键和值都作为值分配给单独的键？答案

【问题标题】：How to map over an object's properties in order to get an array of data-items where both key and value are assigned each as value to a separate key?如何映射对象的属性以获取数据项数组，其中键和值都作为值分配给单独的键？
【发布时间】：2022-06-14 17:44:42
【问题描述】：

我正在动态调用博客类别以及具有这些类别的帖子数量。我需要一个名为 tabs 的对象来包含名为 categoryTitle 的类别 Titles 以及具有该类别的名为 count 的帖子数量。我希望最终的对象数组看起来像这样：

   const tabs = [
          { categoryTitle: "blonde", count: "2"},
          { categoryTitle: "corrections", count: "2" },
          { categoryTitle: "offer", count: "1" },
          { categoryTitle: "products", count: "1" },
          { categoryTitle: "style", count: "1" },
        ];

我将如何遍历下面的这两个对象来创建一个像上面这样的对象？或者我应该建立一个类并传递对象？

{blonde: 2, corrections: 2, offers: 1, products: 1, style: 1}

【问题讨论】：

嘿，你能分享一下你的尝试吗？该网站是为了在您遇到困难时获得帮助，而不是要求某人为您编写代码，请参阅stackoverflow.com/help/how-to-ask。这可能是投反对票的原因......
@guyzo 我添加了一个答案，希望它能按照你的期望工作。
Object.entries({ blonde: 2, corrections: 2, offers: 1, products: 1, style: 1 }).map(([key, value]) => ({ categoryTitle: key, count: String(value) }));

标签： javascript arrays object mapping key-value

【解决方案1】：

鉴于我可以从上下文中理解，这里是代码。如果它不起作用，请在您的问题中包含该案例。

let oldObj = { blonde: 2, corrections: 2, offers: 1, products: 1, style: 1 };
const keys = Object.keys(oldObj);
const values = Object.values(oldObj);
let newObj = [];
for (i = 0; i < keys.length; i++) {
    newObj.push({ categoryTitle: keys[i], count: '' + values[i] });
}

console.log(newObj);

【讨论】：

感谢工作，但需要使用 let oldObj = { 金发：2，更正：2，优惠：1，产品：1，风格：1 };常量键 = Object.keys(oldObj);常量值 = Object.values(oldObj);让 newObj = []; for (let i = 0; i

【解决方案2】：

您可以简单地通过使用Array.map() 方法和Object.keys() 来实现这一点。

演示：

const obj = {
    blonde: 2,
  corrections: 2,
  offers: 1,
  products: 1,
  style: 1
};

const tabs = Object.keys(obj).map(key => {
    return {
    categoryTitle: key,
    count: obj[key]
  }
});

console.log(tabs);

【讨论】：

【解决方案3】：

一种方法是在提供的对象的entries（键值对）上使用map，并根据OP 的要求（包括value 的string 类型转换）分配key 和value。

console.log(
  Object
    .entries({
      blonde: 2,
      corrections: 2,
      offers: 1,
      products: 1,
      style: 1,
    })
    .map(([key, value]) => ({
      categoryTitle: key,
      count: String(value),
    }))
);

.as-console-wrapper { min-height: 100%!important; top: 0; }

【讨论】：