使用collect.js处理数组和对象

https://github.com/ecrmnn/collect.js/#

引入collect.js

https://github.com/ecrmnn/collect.js/#installation

npm install collect.js --save

<script src="https://cdn.jsdelivr.net/npm/collect.js@4.0.25/build/collect.min.js"></script>

深度去重

https://github.com/ecrmnn/collect.js/#unique

简单数组去重

const collection = collect([1, 1, 1, 2, 3, 3]);

const unique = collection.unique();

unique.all();

//=> [1, 2, 3]

对象数组去重

const collection = collect([
{ name: 'iPhone 6', brand: 'Apple', type: 'phone' },
{ name: 'iPhone 5', brand: 'Apple', type: 'phone' },
{ name: 'Apple Watch', brand: 'Apple', type: 'watch' },
{ name: 'Galaxy S6', brand: 'Samsung', type: 'phone' },
{ name: 'Galaxy Gear', brand: 'Samsung', type: 'watch' },
]); const unique = collection.unique('brand'); unique.all(); //=> [
//=> { name: 'iPhone 6', brand: 'Apple', type: 'phone' },
//=> { name: 'Galaxy S6', brand: 'Samsung', type: 'phone' },
//=> ]

对象数组回调函数处理去重

const collection = collect([
{ name: 'iPhone 6', brand: 'Apple', type: 'phone' },
{ name: 'iPhone 5', brand: 'Apple', type: 'phone' },
{ name: 'Apple Watch', brand: 'Apple', type: 'watch' },
{ name: 'Galaxy S6', brand: 'Samsung', type: 'phone' },
{ name: 'Galaxy Gear', brand: 'Samsung', type: 'watch' },
]); const unique = collection.unique(function (item) {
return item.brand + item.type;
}); unique.all(); //=> [
//=> { name: 'iPhone 6', brand: 'Apple', type: 'phone' },
//=> { name: 'Apple Watch', brand: 'Apple', type: 'watch' },
//=> { name: 'Galaxy S6', brand: 'Samsung', type: 'phone' },
//=> { name: 'Galaxy Gear', brand: 'Samsung', type: 'watch' },
//=> ]

简单排序和深度排序

简单数组排序

https://github.com/ecrmnn/collect.js/#sort

const collection = collect([5, 3, 1, 2, 4]);

const sorted = collection.sort();

sorted.all();

//=> [1, 2, 3, 4, 5]

简单数组回调函数处理排序

const collection = collect([5, 3, 1, 2, 4]);

const sorted = collection.sort(function (a, b) {
return b - a;
}); sorted.all(); //=> [5, 4, 3, 2, 1]

对象数组排序

https://github.com/ecrmnn/collect.js/#sortby

const collection = collect([
{ name: 'Desk', price: 200 },
{ name: 'Chair', price: 100 },
{ name: 'Bookcase', price: 150 },
]); const sorted = collection.sortBy('price'); sorted.all(); //=> [
//=> { name: 'Chair', price: 100 },
//=> { name: 'Bookcase', price: 150 },
//=> { name: 'Desk', price: 200 },
//=> ]

对象数组回调函数处理排序

const collection = collect([
{ name: 'Desk', colors: ['Black', 'Mahogany'] },
{ name: 'Chair', colors: ['Black'] },
{ name: 'Bookcase', colors: ['Red', 'Beige', 'Brown'] },
]); const sorted = collection.sortBy(function (product, key) {
return product['colors'].length;
}); sorted.all(); //=> [
//=> { name: 'Chair', colors: ['Black'] },
//=> { name: 'Desk', colors: ['Black', 'Mahogany'] },
//=> { name: 'Bookcase', colors: ['Red', 'Beige', 'Brown'] },
//=> ]

降序排序

使用方法和sortBy一样,但得到降序结果

https://github.com/ecrmnn/collect.js/#sortbydesc

==============================================

本文链接:https://www.cnblogs.com/stumpx/p/9515848.html

==============================================

js对象数组深度去重和深度排序的更多相关文章

  1. js对象数组多字段排序

    来源:js对象数组按照多个字段进行排序 一.数组排序 Array.sort()方法可以传入一个函数作为参数,然后依据该函数的逻辑,进行数组的排序. 一般用法:(数组元素从小大进行排序) var a = ...

  2. js 对象数组去重

    var arr = [{ "name": "ZYTX", "age": "Y13xG_4wQnOWK1QwJLgg11d0pS4h ...

  3. JS对象—数组总结(创建、属性、方法)

    JS对象—数组总结(创建.属性.方法) 1.创建字符串 1.1 new Array() var arr1 = new Array(); var arr2 = new Array(6); 数组的长度为6 ...

  4. 前台的js对象数组传到后台处理。在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>

    前台的js对象数组传到后台处理.在前台把js对象数组转化为json字符串,在后台把json字符串解析为List<>

  5. js对象数组中的某属性值 拼接成字符串

    js对象数组中的某属性值 拼接成字符串 var objs=[ {id:1,name:'张三'}, {id:2,name:'李四'}, {id:3,name:'王五'}, {id:4,name:'赵六' ...

  6. js对象/数组深度复制

    今天碰到个问题,js对象.数组深度复制:之前有见过类似的,不过没有实现函数复制,今晚想了一下,实现代码如下: function clone(obj) { var a; if(obj instanceo ...

  7. js对象,数组,字符串的操作

    循环绑定=>变量污染 for (var i = 0;i<lis.length;i++){ lis[i].index = i;#给页面元素对象添加一个任意属性(保留索引的属性index) # ...

  8. JS 对象 数组求并集,交集和差集

    一.JS数组求并集,交集和差集 需求场景 最近,自己项目中有一些数组操作,涉及到一些数学集的运算,趁着完成后总结一下. 简化问题之后,现有两数组a = [1, 2, 3],b = [2, 4, 5], ...

  9. js对象数组按属性快速排序

    前一篇<关于selector性能比赛>中提到,目测觉得在$("div,p,a")这样有逗号时,sizzle耗时异常(600多个元素,花了200ms),说是它可能没有优化 ...

随机推荐

  1. [转] 买彩票的利器--gun

    源链接 还在自己买彩票吗,有个现成的:GNU shuf命令. shuf -i - -n | 这样就会产生两组彩票(1~36个数字任选) 当然还可以派其他用途,比如: shuf -e clubs hea ...

  2. C语言-- static 全局使用示例

    C语言-- static 全局使用示例  前言:看到很多使用Objective-C开发IOS的大牛,有时候会使用static全局变量,相比之下,我却很少用这个,从而很少对其有着比较有实质意义的理解,甚 ...

  3. 在CentOS上把MySQL从5.5升级到5.6

    在CentOS上把MySQL从5.5升级到5.6 摘要:本文记录了在CentOS 6.3上,把MySQL从5.5.28升级到5.6.19的过程. 1. 概述 在我做的一个项目中,最近我对生产服务器上的 ...

  4. Node-webkit 介绍

    什么是Node-webkit ? Node-webkit 是Intelproject师rogerwang写的一个基于node.js和chromium的应用程序执行环境,通过node-webkit,我们 ...

  5. android各种菜单使用介绍

    Android菜单的有这几种: 1,OptionMenue:选项菜单 2,contextMenu:上下文菜单 3,SubMenu子菜单 其中,OptionMenue与contextMenu的区别(Op ...

  6. diy数据库(二)--网络通信类

    一.首先,我们先实现OSS层的ossSocket类.供数据库client和数据库引擎进行通信 友情提示:相应上面的类图的头文件和源码附在了本文的最以下. int _fd ;//socket的文件描写叙 ...

  7. Latex 2: 解决WinEdt和TexWorks用久之后忽然不能正反向搜索

    说明:下面说的WinEdt版本是10.1,TexWorks是texlive2016中自带的texworks,如果情况不一样请自行测试,原理一样 1.不能正向搜索: 解决:① 确定路径名是英文名(实际上 ...

  8. shell脚本常用(记)

    1.变量检查,判空 a.直接变量判断  if [ ! $1 ];then ..empty..fi b.变量通过" "引号引起来  if [ ! -n "$1" ...

  9. (21) java web的struts2框架的使用

    在javaweb开发过程中,如果只使用servlet,jdbc,jsp进行开发,也可以遵从MVC的模式,这时候,servlet相当于control层,属于负责处理业务逻辑的控制器,同时也需要对获取和返 ...

  10. CentOS 7.2更改网卡名称

    背景 没啥背景,就是VMWare装的CentOS虚拟机的自带网卡名有点乱,想重新定义一下. 环境 1.VMWare虚拟机 6张网卡 2.系统 [root@localhost ~]# cat /etc/ ...