JS利用map整合双数组的小技巧分享

JS利用map整合双数组的小技巧是指通过使用map函数，把两个数组逐个对应元素整合成一个新的数组。下面是具体的步骤及示例：

1. 首先明确双数组整合的要求

如果我们有两个数组：

const arr1 = [1, 2, 3];
const arr2 = ['a', 'b', 'c'];

我们希望将这两个数组逐个对应元素整合成一个新的数组，即得到：

const newArr = [
  [1, 'a'],
  [2, 'b'],
  [3, 'c']
];

2. 使用map函数

我们可以使用map函数去实现这个目的，这个方法比较简单：

const arr1 = [1, 2, 3];
const arr2 = ['a', 'b', 'c'];

const newArr = arr1.map((item, index) => {
  return [item, arr2[index]];
});

解析：

• map函数接受一个回调函数，该回调函数以每个元素的值和下标作为参数；
• 我们在回调函数中返回一个包含当前值和arr2对应下标的新数组。

这个方法能够满足基本的需求，但是实际使用时常常会有更多细节需要考虑，下面介绍一些经验技巧：

3. 长度不同的数组如何整合

如果我们要整合的两个数组长度不同，该怎么处理呢？一种简单的方法是遍历数组较短的那一个，如果对应下标有值则返回合并后的数组，否则返回只包含当前数组元素的新数组：

const arr1 = [1, 2, 3];
const arr2 = ['a', 'b'];

const newArr = arr1.map((item, index) => {
  return arr2[index] ? [item, arr2[index]] : [item];
});

// 输出：[[1, 'a'], [2, 'b'], [3]]
console.log(newArr);

当arr2[index]为undefined时，它会转换成false，从而返回[item]这样只包含当前数组元素的新数组。

4. 替换缺省值

在实际应用中，我们有时候需要替换缺省值，例如将undefined替换成其他值。这时候我们可以在回调函数里面进行判断：

const arr1 = [1, 2, 3];
const arr2 = ['a', 'b'];

const defaultVal = '-';
const newArr = arr1.map((item, index) => {
  const str = arr2[index] !== undefined ? arr2[index] : defaultVal;
  return [item, str];
});

// 输出：[[1, 'a'], [2, 'b'], [3, '-']]
console.log(newArr);

这里我们使用了三元表达式，如果arr2[index]不是undefined，就返回arr2[index]，否则返回缺省值。