js對象數組深度去重和深度排序

 

使用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

 

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

本文連接：http://www.javashuo.com/article/p-sitxzlfw-mg.html

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