如何使用 underscoreJS 过滤对象数组?

How to filter object array using underscoreJS?

(已解决,查看回复中的解决方案)

问题:

我有一个对象数组,我希望能够只过滤那些等于我指定的对象的对象,我尝试了很多方法,但最后我得到了相同的空数组。

我认为数组 returns 是空的,因为我正在遍历对象数组而不是简单数组。

这里我展示我的代码:

我还放置了 underscoreJS 文档中显示的过滤器示例

(点击按钮显示此结果)

$(document).ready(function() {

  /*
   *   START - My Filter using Underscore.js
   *
   */
  var arrObject = [{
    "data": [{
        "img": "test1"
      },
      {
        "img": "test2"
      },
      {
        "img": "/image_folder/sub_folder/886.jpg"
      }
    ]
  }];

  var compare = [{
    "img": "/image_folder/sub_folder/886.jpg"
  }];

  var finalArray;

  //console.log(arrObject);
  //console.log(compare);

  $.each(arrObject, function(index, element) {
    //console.log(element.data);
    finalArray = _.filter(element.data, function(ev) {
      return ev == compare;
    });
  });

  console.log(finalArray);

  /*
   *   END - My Filter using Underscore.js
   *
   */




  /*
   *   START - ORIGINAL Filter from Documentation Underscore.js
   *
   */
  $(document).on("click", ".originalUnderscore", function() {
      var evens = _.filter([1, 2, 3, 4, 5, 6], function(num) {
      return num % 2 == 0;
    });
    console.log(evens);
  });
  /*
   *   END - ORIGINAL Filter from Documentation Underscore.js
   *
   */

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

<button class="originalUnderscore">Click to show the original filter</button>

首先,比较对象时应该使用_.isMatch(...),因为===只比较引用
其次,您将对象 element.data[0] 与数组 compare

进行比较

所以你的代码应该是这样的:

$(document).ready(function() {
  const arrObject = [{
    "data": [{
        "img": "test1"
      },
      {
        "img": "test2"
      },
      {
        "img": "/image_folder/sub_folder/886.jpg"
      }
    ]
  }];

  const compare = {
    "img": "/image_folder/sub_folder/886.jpg"
  };

  $('.filterBtn').on('click', () => {
    let filtredArray = [];
    $.each(arrObject, (index, element) => {
      filtredArray = _.filter(element.data, function(ev) {
        return _.isMatch(ev, compare);
      });
      console.log(`filtredArray from data in element at index ${index}`);
      console.log(filtredArray);
    });
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

<button class="filterBtn">Click filter</button>