zoukankan      html  css  js  c++  java
  • 终极干货,数组去重且显示每一个数据重复的次数

    正常请求到数据后,如果我们想把统计数据制成图表就非常的麻烦。

    今天给大家带来比较实用的两个方法,把数组去重且显示每一个数据重复的次数

    ---本文章为原创文章,转载请注明出处---

     下文代码有详细的注释,再次就不做赘述了直接上代码

    **方法一(使用对象记录重复的元素,以及出现的次数)

    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>Document</title>
    </head>
    <body>
    	<script>
    		// 首先声明一个数组稍后使用
    			var _arr = ['旅行箱', '旅行箱', '小米', '大米', '大米', '大米', '大米'];
    			// 创建一个空数组存放数据
    			var _res = []; // 
    			// 先对数组进行排序,相同的字符会排在一起
    			_arr.sort();
    			// 对整个数组进行遍历
    			for(var i = 0; i < _arr.length;) {
    				// 默认出现次数为0
    				var count = 0;
    				// 声明一个变量J,让J等于I,如果下一个字符等于当前索引,就把count的值加1
    				for(var j = i; j < _arr.length; j++) {
    					if(_arr[i] == _arr[j]) {
    						count++;
    					}
    				}
    				// 然后把当前索引I保存下来,依旧count的值存起来
    				_res.push([_arr[i], count]);
    				i += count;
    			}
    			//_res 二维数维中保存了 值和值的重复数
    			var _newArr = [];
    			for(var i = 0; i < _res.length; i++) {
    				// console.log(_res[i][0] + "重复次数:" + _res[i][1]);
    				_newArr.push(_res[i][0] + 'x' + _res[i][1]);
    			}
    			console.log(_newArr)
    		</script>G
    </body>
    </html>
    

    **方法二(set方法去重且显示每一个数据重复的次数)

    <script>
    	// 声明一个数组测试
    	var arr = ['张三', '张三', '8月7号', '8月7号'];
      function arrayCnt(arr) {
      	// 声明一个空数组用来装载数据
      var newArr = [];
      //使用set进行数组去重,得到一个不重复的数组
      newArr = [...new Set(arr)];
      // 新建一个数组长度等于newArr长度的空数组
      var newarr2 = new Array(newArr.length);
      // 以去重后数组的数组,为索引,赋默认值0
      for(var t = 0; t < newarr2.length; t++) {
       newarr2[t] = 0;
       console.log(newarr2)
      }
      // 通过对newArr和arr遍历,如果arr中的值有重复数值,则newarr2的相应索引下值 +1
      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);
    </script>
    

      

      

  • 相关阅读:
    背包问题
    计蒜客lev3
    线段树BIT操作总结
    图论题收集
    Codeforces Round #607 (Div. 2) 训练总结及A-F题解
    2-sat 学习笔记
    洛谷 P3338 【ZJOI2014】力/BZOJ 3527 力 题解
    $noi.ac$ #51 array 题解
    洛谷 P3292 【SCOI2016】幸运数字/BZOJ 4568 幸运数字 题解
    洛谷 P5283 【十二省联考2019】异或粽子 题解
  • 原文地址:https://www.cnblogs.com/zhaohongcheng/p/11331766.html
Copyright © 2011-2022 走看看