如何从 JavaScript 中的键值对对象创建单个对象？

Question

我有几个对象，我想创建另一个对象，它具有来自特定数组 (const props = []) 的键和来自这些对象的值 - 如果它只存在于这些对象中，但如果不存在 - 我想推送null 或其他一些假值。

我的代码：

const props = ["name", "price", "qty", "category"]
let len = props.length;

const obj_1 = {
  name: "Product_1",
  price: 120,
  category: 'phone'
}

const obj_2 = {
  name: "Product_2",
  price: 7893,
  category: 'program_eq',
  qty: 5
}

const final_obj = {
  name: ["Product_1", "Product_2"],
  price: [120, 7893],
  category: ["phone", "program_eq"],
  qty: [null, 5]
}

我花了很多时间来解决这个问题并找到了一些解决方案 - 但它只给了我第一个对象。 我正在使用 lodash/map，它可以帮助我处理不同类型的集合。

你可以在下面看到我的解决方案：

const final_obj = {};
    const props = ["name", "price", "qty", "category"];
    let len = props.length;

    const obj = {
      c1s6c156a1cascascas: {
        item: {
          name: "Product_1",
          price: 120,
          category: "phone"
        }
      },
      c454asc5515as41cas78: {
        item: {
          name: "Product_2",
          price: 7893,
          category: "program_eq",
          qty: 5
        }
      }
    };

    _.map(obj, (element, key) => {
      console.log(element.item);
      while (len) {
        let temp = props.shift();
        let tempData = [];
        if (element.item.hasOwnProperty([temp])) {
          tempData.push(element.item[temp]);
        } else {
          tempData.push("---");
        }
        final_obj[temp] = tempData;
        len--;
      }
    });
    console.log(final_obj); 
    
    //
    category:["phone"]
    name:["Product_1"],
    price:[120],
    qty:["---"],

Answer 1

您可以使用reduce() 方法执行此操作，该方法将返回对象并在内部使用forEach() 循环。

const props = ["name", "price", "qty", "category"];
const obj = {"c1s6c156a1cascascas":{"item":{"name":"Product_1","price":120,"category":"phone"}},"c454asc5515as41cas78":{"item":{"name":"Product_2","price":7893,"category":"program_eq","qty":5}}}

const result = Object.values(obj).reduce((r, e) => {
  props.forEach(prop => {
    if(!r[prop]) r[prop] = []
    r[prop].push(e.item[prop] || null)
  })
  return r;
}, {})

console.log(result)

Answer 2

这就是我的处理方式：

const final_obj = { };
const props = ["name", "price", "qty", "category"];
const obj = {"c1s6c156a1cascascas":{"item":{"name":"Product_1","price":120,"category":"phone"}},"c454asc5515as41cas78":{"item":{"name":"Product_2","price":7893,"category":"program_eq","qty":5}}}

// set up each property as an empty array in the object
props.forEach(item => {
    final_obj[item] = [];
});

// this iterates over every property in the object
_.forOwn(obj, value => {
    props.forEach(item => {
        // just push the values undefined or no into each property array
        final_obj[item].push(value.item[item]);
    });
});
console.log(final_obj);

Answer 3

您也可以使用一些 lodash 函数。

将 props 数组转换为一个对象，其中键是 props 的值，哪些值是从对象中提取的。如果对象中不存在该属性，则返回 null。

const getValFromObj = (obj, key) => _.map(obj, _.partial(_.get, _, key, null));
const setValInResult = (res, key) => _.set(res, key, getValFromObj(obj, 'item.' + key));
const groupByProps = (props, obj) => _.transform(props, setValInResult, {});

const props = ["name", "price", "qty", "category"];
const obj = {
  "c1s6c156a1cascascas": {
    "item": {
      "name": "Product_1",
      "price": 120,
      "category": "phone"
    }
  },
  "c454asc5515as41cas78": {
    "item": {
      "name": "Product_2",
      "price": 7893,
      "category": "program_eq",
      "qty": 5
    }
  }
}

console.log(groupByProps(props, obj));

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.5/lodash.min.js"></script>