Question

如何使用集合对象成员的键和值将集合（对象数组）映射到对象？该集合是：

const collection = [{
  id: 1,
  url: 'http://url1.com'
}, {
  id: 2,
  url: 'http://url2.com'
}, {
  id: 3,
  url: 'http://url3.com'
}];

结果应为：

{
  1: 'http://url1.com',
  2: 'http://url2.com',
  3: 'http://url3.com'
}

为此最好使用lodash

Answer 1

您可以使用Array.reduce()：

const collection = [{
  id: 1,
  url: 'http://url1.com'
}, {
  id: 2,
  url: 'http://url2.com'
}, {
  id: 3,
  url: 'http://url3.com'
}];

const output = collection.reduce((acc, {id, url}) => ({ ...acc, [id]: url }), {});

console.log(output);

使用lodash _.reduce()：

const collection = [{
  id: 1,
  url: 'http://url1.com'
}, {
  id: 2,
  url: 'http://url2.com'
}, {
  id: 3,
  url: 'http://url3.com'
}];

const output = _.reduce(collection, (acc, {id, url}) => ({ ...acc, [id]: url }), {});

console.log(output);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>

Answer 2

最简单的方法是遍历collection数组，并向这样的对象添加新的键值对：

const collection=[{id:1,url:'http://url1.com'},{id:2,url:'http://url2.com'},{id:3,url:'http://url3.com'}];

const ouptut = {};
for (const o of collection)
  ouptut[o.id] = o.url

console.log(ouptut)

另一种方法是使用map创建2D条目数组，如下所示：

[ [1,"http://url1.com"], [2,"http://url2.com"], [3,"http://url3.com"]]

然后使用Object.fromEntries()从这些条目中创建一个对象

const collection=[{id:1,url:'http://url1.com'},{id:2,url:'http://url2.com'},{id:3,url:'http://url3.com'}];

const ouptut = Object.fromEntries(collection.map(o => [o.id, o.url]))

console.log(ouptut)

Answer 3

使用lodash，您可以使用_.keyBy()将数组转换为以id作为键的对象，然后将值映射到url：

const collection = [{"id":1,"url":"http://url1.com"},{"id":2,"url":"http://url2.com"},{"id":3,"url":"http://url3.com"}];

const result = _.mapValues(_.keyBy(collection, 'id'), 'url');

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

与lodash / fp相同的想法：

const { flow, keyBy, mapValues } = _;

const fn = flow(keyBy('id'), mapValues('url'));

const collection = [{"id":1,"url":"http://url1.com"},{"id":2,"url":"http://url2.com"},{"id":3,"url":"http://url3.com"}];

const result = fn(collection);

console.log(result);

<script src='https://cdn.jsdelivr.net/g/lodash@4(lodash.min.js+lodash.fp.min.js)'></script>

Answer 4

这是一种更动态的方法来处理对象的生成。基本上，这种方法会维护一组特定的键，这些键是生成所需输出的目标。

const collection = [{ id: 1, url: 'http://url1.com' }, {id: 2, url: 'http://url2.com'}, {id: 3,url: 'http://url3.com'}],
      keyAsEntries = [["id", "url"]];

let result = collection.reduce((a, c) => {
  keyAsEntries.forEach(([key, value]) => Object.assign(a, {[c[key]]: c[value]}));
  return a;
}, Object.create(null));

console.log(result);

.as-console-wrapper { min-height: 100%; }

Answer 5

使用for循环和变量可以实现此目的。我希望这能解决您的问题。

const collection = [{
  id: 1,
  url: 'http://url1.com'
}, {
  id: 2,
  url: 'http://url2.com'
}, {
  id: 3,
  url: 'http://url3.com'
}];

const sampleFunction = (array) => {
  let output = {}
  for (let i = 0; i < collection.length; i++) {
    output[collection[i].id] = collection[i].url
  }
  return output
}



console.log(sampleFunction(collection))

将集合映射到对象

5 个答案: