JavaScript 数组去重并统计重复元素出现次数的两种实现方式

作者:半夏

时间:2026-10-22

浏览:110

本文介绍在JavaScript中对数组进行去重并统计各元素重复次数的两种方法。第一种通过indexOf手动筛选并二次循环计数;第二种利用ES6的Set对象简化去重过程,随后同样通过嵌套循环统计频次。文章包含完整代码示例,适用于需要处理数据重复性的前端开发场景。

文章目录

基于indexOf的传统数组去重与计数

首先介绍第一种实现思路。该方法不依赖ES6新特性,主要依靠数组的indexOf方法和嵌套循环来完成。核心逻辑是遍历原始数组,将首次出现的元素存入新数组,然后再次遍历新数组和原数组,通过相等性判断累计每个唯一元素的出现次数。


var arr = [1, 2, 3, 1, 2, 4];
  function arrayCnt(arr) {
  var newArr = [];
  for(var i = 0; i < arr.length; i++) {
   if(newArr.indexOf(arr[i]) == -1) {
   newArr.push(arr[i])
   }
  }
  var newarr2 = new Array(newArr.length);
  for(var t = 0; t < newarr2.length; t++) {
   newarr2[t] = 0;
  }
  for(var p = 0; p < newArr.length; p++) {
   for(var j = 0; j < arr.length; j++) {
   if(newArr[p] == arr[j]) {
    newarr2[p]++;
   }
   }
  }
  for(var m = 0; m < newArr.length; m++) {
   console.log(newArr[m] + "重复的次数为:" + newarr2[m]);
  }
  }
  arrayCnt(arr);

利用Set对象简化去重流程

接着介绍第二种方法,即利用ES6引入的Set数据结构进行去重。Set本身具有去重特性,通过展开运算符可以迅速获得去重后的数组。之后,统计逻辑与第一种方法一致,依然使用嵌套循环来遍历去重数组和原始数组,计算并输出每个元素的重复次数。


var arr = [1, 2, 3, 1, 2, 4];
  function arrayCnt(arr) {
  var newArr = [];
  //使用set进行数组去重
  newArr = [...new Set(arr)];
  var newarr2 = new Array(newArr.length);
  for(var t = 0; t < newarr2.length; t++) {
   newarr2[t] = 0;
  }
  for(var p = 0; p < newArr.length; p++) {
   for(var j = 0; j < arr.length; j++) {
   if(newArr[p] == arr[j]) {
    newarr2[p]++;
   }
   }
  }
  for(var m = 0; m < newArr.length; m++) {
   console.log(newArr[m] + "重复的次数为:" + newarr2[m]);
  }
  }
  arrayCnt(arr);

以上这篇JavaScript 数组去重并统计重复元素出现的次数实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持本站。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章