【问题标题】:Skip and return objects from list of object using Lodash/Underscore使用 Lodash/Underscore 从对象列表中跳过并返回对象
【发布时间】:2015-01-04 05:34:26
【问题描述】:

我需要执行类似于以下用 C# 编写的操作:

int[] items = { 1, 2, 3, 4, 5, 6, 7 };
var a = items.Skip(2).Take(3);

返回 3、4 和 5

同样,我需要跳过对象列表

中的记录
$scope.myObject = [ { Editable: true, Name: "Daniel Test", Site: "SE100"},
                    { Editable: true, Name: "Test new", Site: "SE100"},
                    { Editable: false, Name: "Test", Site: "SE100"} ]

我需要跳过第一条记录并取回剩余的记录,即第1-n条记录

如何使用 lodash/underscore 来做到这一点?

【问题讨论】:

    标签: javascript underscore.js lodash


    【解决方案1】:

    在 Lodash 中,firstrest 函数的行为与下划线不同。即他们不接受长度参数。而应该使用droptake

    const a = _.take(_.drop(items, skipCount), takeCount);
    
    // or
    
    const a = _(items).drop(skipCount).take(takeCount).value();
    

    【讨论】:

      【解决方案2】:

      下划线的firstrest 应该可以解决问题:

      var a = _.first( _.rest(items, 2), 3);
      

      and rest on it's own 可以用来跳过第一条记录:

      $scope.allButTheFirst = _.rest( $scope.myObject, 1)
      

      链接可用于使语句更令人赏心悦目,从而提高透明度:

      var a = _.chain(items)
          .rest(2)
          .first(3)
          .value();
      

      正如@RhysvanderWaerden 的回答中指出的那样,使用 lodash 时使用 drop 而不是 firsttake 而不是 rest

      【讨论】:

      • 如果您只想获取数组中的第三项并且正在使用链接,请不要附加.value()。在这种情况下,first() 已经返回一个标量值。
      • 如果value没有被调用,那么结果将是一个下划线包裹的对象,而不是链中最后一个函数返回的值。
      • 你是对的,除非你在没有任何参数的情况下调用first,在这种情况下它返回第一个值而不是包装器。我没有测试过first(1),但我测试过first()
      • 这不再适用于 Lodash v4,因为 rest()first() 方法需要一个函数!见lodash.com/docs/4.17.4#rest
      • @rmks 澄清说这是一个使用下划线的解决方案,并在其中总结了 Rhys van der Waerden 的答案以避免混淆。
      【解决方案3】:

      lodash v3 中可以使用slicetake 方法。作为替代您可以使用数组方法slice

      var offset = 2;
      var limit = 3;
      var items = [1, 2, 3, 4, 5, 6, 7];
      var result1 = _(items).slice(offset).take(limit).value();
      var result2 = items.slice(offset, offset + limit);
      
      document.getElementById('result1').innerText = result1.toString();
      document.getElementById('result2').innerText = result2.toString();
      <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.7.0/lodash.min.js"></script>
      <pre>
        lodash v3: <span id="result1"></span>
        vanila JS: <span id="result2"></span>
      </pre>

      【讨论】:

        【解决方案4】:

        有这个

        const skip = 0;
        const take = 40;
        

        你可以这样做

        return _.slice(items, skip, skip + take);
        

        或者只使用原生js

        items.slice(skip, skip + take);
        

        【讨论】:

          【解决方案5】:

          /* PAGINATION WITH SORTING AND PAGING */
          const page = 1;  // input page, min value 1
          const limit = 2; // input limit min value 1
          
          /* INPUT ARRAY */
          const array = [
            { Editable: true,  Name: "Daniel Test", Site: "SE100"},
            { Editable: true,  Name: "Test new",    Site: "SE100"},
            { Editable: false, Name: "Test",        Site: "SE100"},
          ];
          
          /* PAGINATION WITH SORTING AND PAGING */
          const result = _(array)
                          .orderBy(['Name'], ['asc']) // sort by ascendind
                          .drop((page - 1) * limit)   // page in drop function starts from 0
                          .take(limit)                // limit 2
                          .value();
          
          console.log(result);
          console.log(JSON.stringify(result));
          /*
            RESULT: 
            limit 2
            sort by ascendind
            [
               {
                  "Editable":true,
                  "Name":"Daniel Test", // name sorted by ascendind
                  "Site":"SE100"
               },
               {
                  "Editable":false,
                  "Name":"Test",
                  "Site":"SE100"
               }
            ]
          */
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.6/lodash.min.js"&gt;&lt;/script&gt;

          【讨论】:

            猜你喜欢
            • 1970-01-01
            • 1970-01-01
            • 2015-09-12
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2016-08-10
            • 1970-01-01
            相关资源
            最近更新 更多