如何将数组与对象和键组合成多维数组

时间:2018-12-14 03:33:17

标签: javascript jquery arrays

如何将2个数组与对象和键合并为1个数组。 array1 = [a, b, c , d] array2 = [z, y, x, w]我想成为一个像result = [[foo: a, bar: z], [foo: b, bar: y], [foo: c, bar: x], [foo: d, bar: w]]这样的数组。我只是可以在没有对象和键的情况下像这样组合:

var array1 = [a, b, c , d];
var array2 = [z, y, x, w];
var result = [];
result = $.map(array1, function (el, idx) {
  return [[el, array2[idx]]];
});
output: [[a, z],[b, y],[c, x],[d, w]];

2 个答案:

答案 0 :(得分:2)

如果您想要一个包含键foobar(看起来或多或少像您)的对象数组,那么您就快到了。您只需要使用map()而不是数组来创建对象:

var array1 = ['a', 'b', 'c' , 'd'];
var array2 = ['z', 'y', 'x', 'w'];

let result = array1.map((item, index) => ({foo:item, bar: array2[index]}))
console.log(result)

答案 1 :(得分:1)

清理

首先,对初始版本进行一些清理:

var array1 = ['a', 'b', 'c', 'd'];
var array2 = ['z', 'y', 'x', 'w'];
var result = array1.map(function (el, idx) {
  return [[el, array2[idx]]];
});
console.log(result)
.as-console-wrapper {height: 100vh !important;}

请注意,此处的数组值以字符串形式列出,只是为了显示正在发生的事情。但也请注意,我们可以使用Arrays的map方法而不是jQuery的版本。

更改为对象

但是现在我们可以轻松地更改它以获得您想要的输出:

var array1 = ['a', 'b', 'c', 'd'];
var array2 = ['z', 'y', 'x', 'w'];
var result = array1.map(function (el, idx) {
  return {foo: el, bar: array2[idx]};
});
console.log(result)
.as-console-wrapper {height: 100vh !important;}

更一般

成对组合两个列表的操作通常称为zip -就像两个列表上的拉链一样。

我们可以使用类似于您的代码的方式来编写朴素的zip函数:

const zip = function(xs, ys) {
  return xs.map(function(x, i) {return [x, ys[i]]})
}

const array1 = ['a', 'b', 'c' , 'd'];
const array2 = ['z', 'y', 'x', 'w'];

const result = zip(array1, array2)

console.log(result)
.as-console-wrapper {height: 100vh !important;}

您问题的常规功能

将这个版本的抽象与用于创建对象的扩展相结合,我们可以编写一个函数zipWith来接受两个列表,以及一个用来将每个元素组合成一个新值的函数:

const zipWith = function(fn) {
  return function(xs, ys) {
    return xs.map(function(x, i) {return fn(x, ys[i]);})
  }
}
const array1 = ['a', 'b', 'c' , 'd'];
const array2 = ['z', 'y', 'x', 'w'];
const foobar = (x, y) => ({foo: x, bar: y})

const result = zipWith(foobar)(array1, array2)

console.log(result)
.as-console-wrapper {height: 100vh !important;}

可能的扩展名

此函数至少有一个缺点:如果列表的长度不同,则您的函数可能必须处理其两个参数中可能存在的未定义值。我们可以通过仅处理较短列表的长度来解决此问题。这并不难做到,但是代码不会那么简单。如果您对此感兴趣,我们可以逐步解决。