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 相关文章推荐
jquery remove方法应用详解
Nov 22 Javascript
javascript如何使用bind指定接收者
May 04 Javascript
js实现同一页面可多次调用的图片幻灯切换效果
Feb 28 Javascript
javascript实现删除前弹出确认框
Jun 04 Javascript
jquery实现的判断倒计时是否结束代码
Feb 05 Javascript
JavaScript数值千分位格式化的两种简单实现方法
Aug 01 Javascript
JS禁止查看网页源代码的实现方法
Oct 12 Javascript
easyui-combobox 实现简单的自动补全功能示例
Nov 08 Javascript
Angular.JS判断复选框checkbox是否选中并实时显示
Nov 30 Javascript
脚手架vue-cli工程webpack的基本用法详解
Sep 29 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 Javascript
Vue 图片压缩并上传至服务器功能
Jan 15 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 选项及相关信息函数库
2006/12/04 PHP
phpmyadmin里面导入sql语句格式的大量数据的方法
2010/06/05 PHP
Win7环境下Apache连接MySQL提示连接已重置的解决办法
2017/05/09 PHP
php模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(中)
2017/06/11 PHP
jQuery 自动增长的文本输入框实现代码
2010/04/02 Javascript
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
js捕获鼠标滚轮事件代码
2013/12/16 Javascript
SinaEditor使用方法详解
2013/12/28 Javascript
javascript中clone对象详解
2014/12/03 Javascript
jQuery实现判断滚动条到底部
2015/06/23 Javascript
js实现可键盘控制的简单抽奖程序
2016/07/13 Javascript
Bootstrap中定制LESS-颜色及导航条(推荐)
2016/11/21 Javascript
JavaScript易错知识点整理
2016/12/05 Javascript
Ionic+AngularJS实现登录和注册带验证功能
2017/02/09 Javascript
解决Node.js使用MySQL出现connect ECONNREFUSED 127.0.0.1:3306的问题
2017/03/09 Javascript
Angular4项目中添加i18n国际化插件ngx-translate的步骤详解
2017/07/02 Javascript
微信小程序实现点击返回顶层的方法
2017/07/12 Javascript
Windows下Node爬虫神器Puppeteer安装记
2019/01/09 Javascript
javascript实现简单打字游戏
2019/10/29 Javascript
js 递归json树实现根据子id查父id的方法分析
2019/11/08 Javascript
Python中逗号的三种作用实例分析
2015/06/08 Python
Python常见的pandas用法demo示例
2019/03/16 Python
Python玩转PDF的各种骚操作
2019/05/06 Python
将tensorflow.Variable中的某些元素取出组成一个新的矩阵示例
2020/01/04 Python
python2和python3哪个使用率高
2020/06/23 Python
python能做哪些生活有趣的事情
2020/09/09 Python
Python实现冒泡排序算法的完整实例
2020/11/04 Python
ONLY德国官方在线商店:购买时尚女装
2017/09/21 全球购物
地球鞋加拿大官网:Earth Shoes Canada
2020/11/17 全球购物
医药代表个人的求职信分享
2013/12/08 职场文书
服务之星获奖感言
2014/01/21 职场文书
美容院合作经营协议书
2014/10/10 职场文书
天河观后感
2015/06/11 职场文书
django注册用邮箱发送验证码的实现
2021/04/18 Python
oracle索引总结
2021/09/25 Oracle
python数据可视化使用pyfinance分析证券收益示例详解
2021/11/20 Python