Javascript Array Distinct (array.reduce实现)
javascript 没有原生的Distinct功能 . (至少现在还没有)
但我们可以通过简单的script 自己实现 .
Distinct就是把数组中重复出现2次或以上的值给删除掉,确保数组内每个值都是唯一的 .
我相信大家开始的时候都会和我用同一个方法来处理。
那就是开一个新的数组(空),然后 for loop 旧的数组 ,然后复制进去新的数组里面,每次复制进去的时候先检查一篇新数组内是否有了这个值,有了就跳过,没有才加进去 。
代码 :
var old_array = [1, 2, 3, 3, 4, 5]; //3重复了
var new_array = [];
for (var i = 0; i < old_array.length; i++) {
var value = old_array[i];
var is_exist = false;
for (var j = 0; j < new_array.length; j++) {
if (new_array[j] === old_array[i]) { //检查
is_exist = true;
break;
}
}
if (is_exist) continue;//跳过
new_array.push(old_array[i]); //添加
}
alert(new_array); //[1,2,3,4,5]
有些人可能觉得这样效率不太好,因为for loop 很多次匹配 .
有人就建议使用 object 来替代
代码 :
var u = {}, a = [];
for (var i = 0, l = this.length; i < l; ++i) {
if (u.hasOwnProperty(this[i])) {
continue;
}
a.push(this[i]);
u[this[i]] = 1;
}
return a;
object 走索引,似乎可以快一些,但是这里有个小问题。
就是如果你的数组中有 object ,这样就会造成错误了。(ECMA6好像不会了)
因为object 的属性不能是 object ,只能是 string 和 number .
所以不鼓励使用这个方法,除非你确保你的数组内的值都是 string , number .
总结 :
方法1的文言文写法是这样的 :
代码 :
var old_array = [1, 2, 3, 3, 4, 5]; //3重复了
old_array = old_array.reduce(function (new_array, old_array_value) {
if (new_array.indexOf(old_array_value) == -1) new_array.push(old_array_value);
return new_array; //最终返回的是 prev value 也就是recorder
}, []);
最后把它加入 array的 prototype里面就可以啦
代码 :
Array.prototype.distinct = function () {
return this.reduce(function (new_array, old_array_value) {
if (new_array.indexOf(old_array_value) == -1) new_array.push(old_array_value);
return new_array; //最终返回的是 prev value 也就是recorder
}, []);
}
调用 :
var old_array = [1, 2, 3, 3, 4, 5]; //3重复了
var new_array = old_array.distinct();
这里顺便提一下 reduce 方法
function(prev,now,index,array) { return prev; }
当index=0时,prev就是我们第一次传入reduce方法的第2个参数 (reduce(fn, 这个值 <--))
接着循环时 now 就是 array 内的值
每次return的值是下一次循环的 prev 值 , 所以最后我们得到的就是prev.
Javascript Array Distinct (array.reduce实现)的更多相关文章
- JavaScript高级编程——Array数组迭代(every()、filter()、foreach()、map()、some(),归并(reduce() 和reduceRight() ))
JavaScript高级编程——Array数组迭代(every().filter().foreach().map().some(),归并(reduce() 和reduceRight() )) < ...
- 详解Javascript中的Array对象
基础介绍 创建数组 和Object对象一样,创建Array也有2种方式:构造函数.字面量法. 构造函数创建 使用构造函数的方式可以通过new关键字来声明,如下所示: 12 var arr = new ...
- javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈
Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...
- 从头开始学JavaScript (十二)——Array类型
原文:从头开始学JavaScript (十二)--Array类型 一.数组的创建 注:ECMAscript数组的每一项都可以保存任何类型的数据 1.1Array构造函数 var colors = ne ...
- JavaScript之对象Array
数组Array是JavaScript中最常用的类型之一,同一数组中可以保存任意类型的数据,并且它的长度是动态的,会随着数组中数据的加减自动变化.每个数组都有一个表示其长度(数组元素的个数)的lengt ...
- javascript类型系统之Array
原文:javascript类型系统之Array 目录 [1]数组创建 [2]数组操作 [3]继承的方法 [4]实例方法 数组转换 数组检测 栈和队列 排序方法 操作方法 位置方法 前面的话 数组是一组 ...
- JavaScript引用类型之Array数组的toString()和valueof()方法的区别
一.转换方法 1.在JavaScript中几乎所有对象都具有toLocaleString().toString和valueof()方法,因为,所有的对象都继承自Object,而前面所说的方法都是Obj ...
- ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展
关于ExtJS对javascript中的Array的扩展.能够參考其帮助文档,文档下载地址:http://download.csdn.net/detail/z1137730824/7748893 因为 ...
- JavaScript中数组Array方法详解
ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...
随机推荐
- ViewPager 详解(二)---详解四大函数
前言:上篇中我们讲解了如何快速实现了一个滑动页面,但问题在于,PageAdapter必须要重写的四个函数,它们都各有什么意义,在上节的函数内部为什么要这么实现,下面我们就结合Android的API说明 ...
- Pascal's Triangle II
Given an index k, return the kth row of the Pascal's triangle. For example, given k = 3, Return [1,3 ...
- java socker编程
转自http://haohaoxuexi.iteye.com/blog/1979837 对于Java Socket编程而言,有两个概念,一个是ServerSocket,一个是Socket.服务端和客户 ...
- Android项目中如何用好构建神器Gradle?(转)
最近在忙团队并行开发的事情,主要是将各个团队的代码分库,一方面可以降低耦合,为后面模块插件化做铺垫,另一方面采用二进制编译,可以加快编译速度.分库遇到了一些问题,很多都要通过Gradle脚本解决,所以 ...
- C# SqlHelper
操作数据库时,经常会把常用的方法封装到一个类中,这里简单写了一个SQLHelper类,供我平时调用. public static class SqlHelper { private static re ...
- python的按位运算
#coding=utf-8#"&"按位与运算,是指一个数字转化为二进制,然后这些二进制的数按位来进行与运算a=7&18print a'''首先将7转化为二进制,得到 ...
- OD: File Vulnerabilities & Protocols & Fuzz
IE.Office 等软件有个共同点,即用文件作为程序的主要输入,但攻击者往往会挑战程序员的假定和假设. 文件格式 Fuzz 就是利用畸形文件测试软件的稳健性,其流程一般包括: * 以一个正常文件作为 ...
- VS2015编译器问题简单记录
问题:VS2015community 无法查找或打开 pdb 文件 解决办法: 1.点击工具->选项, 在选项窗口中展开左侧菜单: 2.展开调试->常规,然后在右边的窗格中勾选“启用服务器 ...
- SpringBoot入门系列:第一篇 Hello World
跟随SpringBoot的文档(http://docs.spring.io/spring-boot/docs/current-SNAPSHOT/reference/htmlsingle/#boot-d ...
- MeasureSpec学习
在自定义View和ViewGroup的时候,我们经常会遇到int型的MeasureSpec来表示一个组件的大小,这个变量里面不仅有组件的尺寸大小,还有大小的模式. 这个大小的模式,有点难以理解.在系统 ...