Question

var color = ["red", "blue"];

var size = ["s", "m", "L"];

//output will be
var final = [
              {
               id: 0-0,
               val: 'red/s'
              },
              {
               id: 0-1,
               val: 'red/m'
              },
              {
               id: 0-2,
               val: 'red/l'
              },
              {
               id: 1-0,
               val: 'blue/s'
              },
              {
               id: 1-1,
               val: 'blue/m'
              },
               {
               id: 1-1,
               val: 'blue/l'
               },
            ];

上面的代码有2个数组，分别是颜色和大小，我尝试了每个数组，并在下面的输出中排列了数组，但是我没有做到。场景就像，颜色具有 2 值，红色是 [0] 和蓝色是 [1] ，并且 size 具有 3 值，即 s是[0] ， m为[1] ， L为[2] 。因此，我希望结果具有自己的键和值作为上面的输出。有人可以帮忙吗？格式为javascript。

Answer 1

您可以使用嵌套的map()函数。使用flatMap()使数组成为一维

var color = ["red", "blue"];
var size = ["s", "m", "L"];

function combineArrays(arr1, arr2){
  return arr1.flatMap((x, i) => 
    arr2.map((y, j) => ({id: `${i}-${j}`, val: `${x}/${y}`}))
  )
}

console.log(combineArrays(color, size))

Answer 2

将第一个数组中的每个条目映射到第二个数组中的每个条目，为每种可能性创建所需的对象，最后需要展平具有的2D数组：

var color = ["red", "blue"];
var size = ["s", "m", "L"];

function everyCombinations(arr1, arr2) {
  return arr1.map((val1, id1) => arr2.map((val2, id2) => ({
    id: `${id1}-${id2}`,
    val: `${val1}/${val2}`
  }))).flat();
}

const result = everyCombinations(color, size);
console.log(result);

Answer 3

您可以在foreach中使用reduce：

const color = ["red", "blue"]
const size = ["s", "m", "L"]

const out = color.reduce((a, c, i1) => (
  size.forEach((s, i2) => a.push({ id: `${i1}-${i2}`, val: `${c}/${s}` })), a
), [])

console.log(out)

Answer 4

如果您更喜欢使用循环-

            var testFunc = function () {
                var colors = ["red", "blue"];
                var sizes = ["s", "m", "L"];

                var res = [];

                for (let i = 0; i < colors.length; i++) {
                    for (var j = 0; j < sizes.length; j++) {
                        res.push({ id: (i + '-' + j), val: colors[i] + '/' + sizes[j] });
                    }
                }

                console.log(res);
            }();

如何将2个数组合并为一个数组

4 个答案: