JavaScrip数组去重操作实例小结


Posted in Javascript onJune 20, 2019

本文实例讲述了JavaScrip数组去重操作。分享给大家供大家参考,具体如下:

内置的for-of方法

<script>
var arr=[2,1,1,3,'','','e','e',true,'true',true,false,false,'false',undefined,'undefined',undefined,null,'null',null];
function uniqueUseForOf(array) {
  const temp = []; //一个临时数组
  // 传入值必须存在,且长度小于等于1的时候直接返回数组
  if (array && array.length <= 1) {
    return array;
  } else {
    //遍历当前数组
    for (let x of array) {
      temp.indexOf(x) === -1 ? temp.push(x) : '';
    }
  }
  return temp;
}
uniqueUseForOf(arr);
console.log(uniqueUseForOf(arr))
</script>

运行结果:

JavaScrip数组去重操作实例小结

内置的forEach方法

<script>
var arr=[3,1,1,3,'','','e','e',true,'true',true,false,false,'false',undefined,'undefined',undefined,null,'null',null];
function uniqueUseForEach(array) {
  // 传入值必须存在,且长度小于等于1的时候直接返回数组
  if (array && array.length <= 1) {
    return array;
  } else {
    var temp = []; //一个临时数组
    //遍历当前数组
    array.forEach(function (value, index) {
      temp.indexOf(value) == -1 ? temp.push(value) : '';
    })
    return temp;
  }
}
uniqueUseForEach(arr);
console.log(uniqueUseForEach(arr))
</script>

运行结果:

JavaScrip数组去重操作实例小结

万能的for方法

<script>
var arr=[1,1,'','','e','e',true,'true',true,false,false,'false',undefined,'undefined',undefined,null,'null',null];
function uniqueUseFor(array) {
  var temp = []; //一个临时数组
  //遍历当前数组
  for (var i = 0, j = array.length; i < j; i++) {
    //很直白,新数组内判断是否有这个值,没有的情况下,就推入该新数组
    temp.indexOf(array[i]) === -1 ? temp.push(array[i]) : '';
  }
  return temp;
}
uniqueUseFor(arr);
console.log(uniqueUseFor(arr))
</script>

运行结果:

JavaScrip数组去重操作实例小结

第一种方法:

<script>
var arr = [1, 2, 3, 4, 1, 2, 4, 5, 6];
console.log(arr);
Array.prototype.unique = function() {
  var n = [this[0]]; //结果数组
  for(var i = 1; i < this.length; i++) //从第二项开始遍历
  {
    //如果当前数组的第i项在当前数组中第一次出现的位置不是i,
    //那么表示第i项是重复的,忽略掉。否则存入结果数组
    if(this.indexOf(this[i]) == i) n.push(this[i]);
  }
  return n;
};
console.log(arr.unique());
</script>

第二种方法:

<script>
var arr = [1,2,3,4,1,2,4,5,6];
console.log(arr);
Array.prototype.unique = function()
{
  var n = {},
    r = []; //n为hash表,r为临时数组
  for (var i = 0; i < this.length; i++) { //遍历当前数组
    if (!n[this[i]]) { //如果hash表中没有当前项
      n[this[i]] = true; //存入hash表
      r.push(this[i]); //把当前数组的当前项push到临时数组里面
    }
  }
  return r;
};
console.log(arr.unique());
</script>

第三种方法:

<script>
var arr = [1,2,3,4,1,2,4,5,6];
console.log(arr);
Array.prototype.unique = function() {
  var n = []; //一个新的临时数组
  for (var i = 0; i < this.length; i++) //遍历当前数组
  {
    //如果当前数组的第i已经保存进了临时数组,那么跳过,
    //否则把当前项push到临时数组里面
    if (n.indexOf(this[i]) == -1) n.push(this[i]);
  }
  return n;
};
console.log(arr.unique());
</script>

上述三种方法运行结果为:

JavaScrip数组去重操作实例小结

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

Javascript 相关文章推荐
JavaScript instanceof 的使用方法示例介绍
Oct 23 Javascript
js导出txt示例代码
Jan 14 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
node.js操作mysql(增删改查)
Jul 24 Javascript
基于jquery实现页面滚动时顶部导航显示隐藏
Apr 20 Javascript
jQuery给元素添加样式的方法详解
Dec 30 Javascript
jQuery实现单击按钮遮罩弹出对话框效果(2)
Feb 20 Javascript
JS一个简单的注册页面实例
Sep 05 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
Sep 12 Javascript
JavaScript数据结构之单链表和循环链表
Nov 28 Javascript
MVVM 双向绑定的实现代码
Jun 21 Javascript
在微信小程序中保存网络图片
Feb 12 Javascript
Vue 动态添加路由及生成菜单的方法示例
Jun 20 #Javascript
JavaScript命名空间模式实例详解
Jun 20 #Javascript
npm的lock机制解析
Jun 20 #Javascript
express如何解决ajax跨域访问session失效问题详解
Jun 20 #Javascript
JS去除字符串最后的逗号实例分析【四种方法】
Jun 20 #Javascript
如何在微信小程序中实现Mixins方案
Jun 20 #Javascript
js JSON.stringify()基础详解
Jun 19 #Javascript
You might like
Php Mssql操作简单封装支持存储过程
2009/12/11 PHP
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
2010/06/28 Javascript
用js判断页面是否加载完成实现代码
2012/12/11 Javascript
Javascript级联下拉菜单以及AJAX数据验证核心代码
2013/05/10 Javascript
JavaScript定时器详解及实例
2013/08/01 Javascript
js原型继承的两种方法对比介绍
2014/03/30 Javascript
将HTML格式的String转化为HTMLElement的实现方法
2014/08/07 Javascript
Javascript学习笔记之函数篇(六) : 作用域与命名空间
2014/11/23 Javascript
JS+CSS实现滑动切换tab菜单效果
2015/08/25 Javascript
关于JavaScript作用域你想知道的一切
2016/02/04 Javascript
JS代码随机生成姓名、手机号、身份证号、银行卡号
2016/04/27 Javascript
使用jQuery实现WordPress中的Ctrl+Enter和@评论回复
2016/05/21 Javascript
JavaScript的this关键字的理解
2016/06/18 Javascript
将html页面保存成图片,图片写入pdf的实现方法(推荐)
2016/09/17 Javascript
Echarts基本用法_动力节点Java学院整理
2017/08/11 Javascript
Vue修改mint-ui默认样式的方法
2018/02/03 Javascript
移动端图片上传旋转、压缩问题的方法
2018/10/16 Javascript
layUI实现前端分页和后端分页
2019/07/27 Javascript
[01:30:15]DOTA2-DPC中国联赛 正赛 Ehome vs Aster BO3 第二场 2月2日
2021/03/11 DOTA
pyqt实现.ui文件批量转换为对应.py文件脚本
2019/06/19 Python
python爬取盘搜的有效链接实现代码
2019/07/20 Python
Python分割训练集和测试集的方法示例
2019/09/19 Python
pygame库实现移动底座弹球小游戏
2020/04/14 Python
python开发入门——列表生成式
2020/09/03 Python
Pycharm plot独立窗口显示的操作
2020/12/11 Python
python gui开发——制作抖音无水印视频下载工具(附源码)
2021/02/07 Python
大学生感恩父母演讲稿
2014/08/28 职场文书
医药公司采购员岗位职责
2014/09/12 职场文书
信访工作汇报材料
2014/10/27 职场文书
中学生逃课检讨书
2015/02/17 职场文书
党员承诺书范文2015
2015/04/27 职场文书
大学推普周活动总结
2015/05/07 职场文书
入党团支部推荐意见
2015/06/02 职场文书
导游词之广东佛山(南风古灶)
2019/09/24 职场文书
Redis集群的关闭与重启操作
2021/07/07 Redis
Java Redisson多策略注解限流
2022/09/23 Java/Android