美文网首页
js对象数组深度去重和深度排序

js对象数组深度去重和深度排序

作者: stumpx | 来源:发表于2018-08-30 17:19 被阅读0次

    js对象数组深度去重和深度排序


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

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

    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.jianshu.com/p/293e86691f09
    原文链接:https://www.cnblogs.com/stumpx/p/9515848.html

    相关文章

      网友评论

          本文标题:js对象数组深度去重和深度排序

          本文链接:https://www.haomeiwen.com/subject/tgjdwftx.html