JS基于对象的特性实现去除数组中重复项功能详解

 更新时间:2017年11月17日 11:14:52   作者:Small_Teemo  
这篇文章主要介绍了JS基于对象的特性实现去除数组中重复项功能,结合实例形式较为详细的分析了js基于key值唯一性实现数组去重的具体步骤与相关操作技巧,需要的朋友可以参考下

本文实例讲述了JS基于对象的特性实现去除数组中重复项功能。分享给大家供大家参考,具体如下:

数组去重的方法有很多,不同的方法的效率也不相同。如前面文章JS实现的数组去除重复数据算法小结中就总结分析了4种实现方法。这里介绍一种高效数组去重的方法:根据JS对象的特性去除数组中重复项的方法。

一、JS对象的特性(本文中所使用的特性):key始终唯一

引例:说明对象key值的唯一性,即当重新给js已有属性赋值的时候,实际上是覆盖了key,而不是新建了key

var t={name:'张三',age:20};//定义个js对象
console.log(t.name);//控制台输出:张三
//注意:此时对象t有两个属性:name、age
t.name='李四';
console.log(t.name);//控制台输出:李四
//注意:此时对象t依然有两个属性:name、age

二、数组去重步骤解析

分为两个步骤:

1. 把要去重的数组转换成一个js的对象并返回。转换规则:把数组中的值变成js对象当中的key,然后value给任意值

2. 把步骤1中的对象再还原成数组,对象的key作为数组中的元素。

三、数组去重实现

var arr=[1,2,3,4,5,23,4,2,4,3];
//1.把数组装换成对象,数组的元素作为对象的key,然后返回对象
function toObject(ac_array){
    var obj={};//私有的对象
    for (var i=0;i<ac_array.length;i++) {
      obj[ac_array[i]] = true;
    }
    console.log(obj);//Object {1: true, 2: true, 3: true, 4: true, 5: true, 23: true}
    return obj;
}
//2.把对象的key获取出来作为数组的元素,然后返回数组
function keys(ac_obj){
    var arr = [];
    for(var item in ac_obj){
      if(ac_obj.hasOwnProperty(item)){
        arr.push(item);
      }
    }
    console.log(arr);//["1", "2", "3", "4", "5", "23"]
    return arr;
}
//综合
function uniq(ac_array){
    return keys(toObject(ac_array));
}
//测试
var uniq_array=uniq(arr);
console.log(uniq_array);//["1", "2", "3", "4", "5", "23"]

代码测试结果:

这种利用js对象key唯一性的特性进行数组去重的方法,在雅虎YUI框架的底层代码中也有用到哦,有兴趣的小火把可以去瞄瞄哦。

PS:这里再为大家提供几款去重复工具供大家参考使用:

在线去除重复项工具:
http://tools.jb51.net/code/quchong

在线文本去重复工具:
http://tools.jb51.net/aideddesign/txt_quchong

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数组操作技巧总结》、《JavaScript排序算法总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript查找算法技巧总结》及《JavaScript错误与调试技巧总结

希望本文所述对大家JavaScript程序设计有所帮助。

相关文章

  • TypeScript 安装使用及基本数据类型

    TypeScript 安装使用及基本数据类型

    这篇文章主要介绍了TypeScript 安装使用及基本数据类型,本文分步骤给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-03-03
  • TS如何从目录中提取所有指定扩展名的文件

    TS如何从目录中提取所有指定扩展名的文件

    .ts是一种高清视频封装格式文件,全称为MPEG2-TS,TS表示TransportStream,这篇文章主要介绍了TS如何从目录中提取所有指定扩展名的文件,需要的朋友可以参考下
    2023-05-05
  • 浅谈JS三座大山之异步和单线程

    浅谈JS三座大山之异步和单线程

    首先我们要知道,js这门语言是单线程的,同时只能做一件事,比如说渲染dom,执行js方法,这些事情只能一个一个做,不能分开执行。(因为js需要操作dom,当两个js方法同时操作一个dom的时候就会出问题,所以js被设计成了单线程)。本文将介绍JS三座大山之异步和单线程。
    2021-06-06
  • JavaScript判断是否是微信浏览器

    JavaScript判断是否是微信浏览器

    通过判断UA中是否有关键字micromessenger,有的话则是微信内置浏览器。下面小编给大家分享实现代码,代码简单易懂,需要的朋友可以参考下
    2016-06-06
  • RGB颜色值转HTML十六进制(HEX)代码的JS函数

    RGB颜色值转HTML十六进制(HEX)代码的JS函数

    转到固定长度的十六进制字符串,不够则补0 javascript找出一个背景色的数值,只好自己解析
    2009-04-04
  • vscode录音及语音实时转写插件开发并在工作区生成本地mp3文件附踩坑日记!

    vscode录音及语音实时转写插件开发并在工作区生成本地mp3文件附踩坑日记!

    以目前的vscode版本来说,作者并没有开放访问本地媒体权限,所以插件市场里面的所有语音相关插件也并没有直接获取vscode的媒体权限,这篇文章主要介绍了vscode录音及语音实时转写插件开发并在工作区生成本地mp3文件 踩坑日记!,需要的朋友可以参考下
    2023-05-05
  • 基于百度地图实现产品销售的单位位置查看功能设计与实现

    基于百度地图实现产品销售的单位位置查看功能设计与实现

    这篇文章主要介绍了基于百度地图实现产品销售的单位位置查看功能设计与实现的相关资料,非常不错具有参考借鉴价值,需要的朋友可以参考下
    2016-10-10
  • JS 数组随机洗牌的实例代码

    JS 数组随机洗牌的实例代码

    这篇文章主要介绍了js 数组随机洗牌的实例代码,非常不错,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2018-09-09
  • 深入理解令牌认证机制(token)

    深入理解令牌认证机制(token)

    这篇文章主要介绍了深入理解令牌认证机制(token),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08
  • ES6新增的math,Number方法

    ES6新增的math,Number方法

    ES6新增的math,Number方法,小编觉得非常不错,需要的朋友参考下吧
    2017-08-08

最新评论