JavaScript数组循环：对比前后元素并修正结果不符问题

需求 #

遍历数组并对比前后元素的name属性，将所有连续重复的name值全部收集到结果数组中。

原数组 #

const array = [{id: 1,name: 'A'},{id: 2,name: 'B'},{id: 3,name: 'B'},{id: 4,name: 'B'},{id: 5,name: 'C'},{id: 6,name: 'D'},{id: 7,name: 'E'},{id: 8,name: 'E'},{id: 9,name: 'E'}]

原代码及结果 #

let result = []
array.forEach(function(item, index) {
    if (index > 0) {
        if (array[index].name == array[index - 1].name) {
            result.push(array[index - 1].name)
        }
    }
});

console.log('result :', result); // 得到的结果: [ 'B', 'B', 'E', 'E' ]

期望结果 #

let result = [ 'B', 'B', 'B', 'E', 'E', 'E' ]

问题分析 #

原代码的逻辑是每次发现当前元素与前一个元素name相同时，仅将前一个元素的name推入结果一次。对于n个连续相同的元素，这种逻辑只会推入(n-1)次，而无法将全部n个元素的name都收集到结果中，这就是结果不符的核心原因。

解决方案 #

方法一：分组收集连续重复元素 #

先将数组按连续相同的name分组，再将长度大于1的分组全部加入结果：

const array = [{id: 1,name: 'A'},{id: 2,name: 'B'},{id: 3,name: 'B'},{id: 4,name: 'B'},{id: 5,name: 'C'},{id: 6,name: 'D'},{id: 7,name: 'E'},{id: 8,name: 'E'},{id: 9,name: 'E'}];

let result = [];
if (array.length === 0) {
  console.log(result);
  return;
}

// 初始化当前分组
let currentName = array[0].name;
let currentGroup = [currentName];

for (let i = 1; i < array.length; i++) {
  if (array[i].name === currentName) {
    // 当前元素与分组name相同，加入分组
    currentGroup.push(array[i].name);
  } else {
    // 当前元素与分组name不同，检查分组长度
    if (currentGroup.length > 1) {
      result = result.concat(currentGroup);
    }
    // 重置分组
    currentName = array[i].name;
    currentGroup = [currentName];
  }
}
// 处理最后一个分组
if (currentGroup.length > 1) {
  result = result.concat(currentGroup);
}

console.log('result :', result); // 输出: [ 'B', 'B', 'B', 'E', 'E', 'E' ]

方法二：跟踪连续序列的起始位置 #

通过跟踪连续相同name序列的起始索引，计算序列长度后批量加入结果：

const array = [{id: 1,name: 'A'},{id: 2,name: 'B'},{id: 3,name: 'B'},{id: 4,name: 'B'},{id: 5,name: 'C'},{id: 6,name: 'D'},{id: 7,name: 'E'},{id: 8,name: 'E'},{id: 9,name: 'E'}];

let result = [];
let startIndex = 0;

for (let i = 1; i <= array.length; i++) {
  // 当元素不同或到达数组末尾时，处理当前序列
  if (i === array.length || array[i].name !== array[startIndex].name) {
    const sequenceLength = i - startIndex;
    if (sequenceLength > 1) {
      // 批量生成对应数量的name并加入结果
      result.push(...Array(sequenceLength).fill(array[startIndex].name));
    }
    startIndex = i;
  }
}

console.log('result :', result); // 输出: [ 'B', 'B', 'B', 'E', 'E', 'E' ]

内容的提问来源于stack exchange，提问作者leang webdev