如何在 Javascript 的 foreach 循环中合并多个数组

Question

如何在 foreach 循环中合并多个数组。我正在尝试将所有 3imageData个数组合并到一个数组中。请告诉我是否错过了以下方法中的任何内容。

  const imageArray = [
      {
        imageData: [
          'https://via.placeholder.com/50',
          'https://via.placeholder.com/60'
        ],
      },
      {
        imageData: [
          'https://via.placeholder.com/100'
        ],
      },
      {
        imageData: [
          'https://via.placeholder.com/150'
        ],
     }
  ];

  processImage() {
    imageArray.forEach((element) => {
      const imageCollection = [...element.imageData];
      console.log(imageCollection);
      // Expected result 
      //['https://via.placeholder.com/50', 'https://via.placeholder.com/60', 'https://via.placeholder.com/100', https://via.placeholder.com/150]
    });
  }

Answer 1

您在循环内声明新的 imageCollection。因此，您每次迭代都会创建一个新数组...

在 forEach 循环外部执行并imageCollection.push(...element.imageData)在 forEach 循环内部使用

Answer 2

您的数组需要位于循环之外，以便在完成forEach后可以访问它。forEach

const imageArray = [
  {
    imageData: [
      'https://via.placeholder.com/50',
      'https://via.placeholder.com/60'
    ]
  },
  {
    imageData: ['https://via.placeholder.com/100']
  },
  {
    imageData: ['https://via.placeholder.com/150']
  }
];

const processImage = function (imageArray) {
  const imageCollection = [];
  imageArray.forEach(element => {
    imageCollection.push(...element.imageData);
  });
  return imageCollection;
};

预期结果processImage(imageArray)

[
  'https://via.placeholder.com/50',
  'https://via.placeholder.com/60',
  'https://via.placeholder.com/100',
  'https://via.placeholder.com/150'
]