zoukankan      html  css  js  c++  java
  • 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

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

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

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

  • 相关阅读:
    命名之法 —— 男名、女名、家族(古诗词与古典名著)
    findContours函数参数详解
    推理集 —— 特殊的时间
    推理集 —— 特殊的时间
    分蛋糕问题 —— 9 个烧饼分给 10 个人
    分蛋糕问题 —— 9 个烧饼分给 10 个人
    辩论之术
    辩论之术
    findContours 轮廓查找
    坚持是一种品行
  • 原文地址:https://www.cnblogs.com/stumpx/p/9515848.html
Copyright © 2011-2022 走看看