jQuery 按数据筛选 属性

Question

我有以下代码段，在某些情况下必须 return 对象，但我收到此错误：Uncaught TypeError: Cannot read property 'obj1' of undefined。但是，我使用控制台在 li 对象中看到了这个数据属性。

for(var i = 0; i < 15; i++){

  li = $('<li>List</li>');
  $(li).data('test', {obj1: (i < 10 ? 'some' : 'any')});
  $(li).appendTo('#list');
}

var f = $('#list li').filter(() => {
  return $(this).data('test').obj1 == 'any'
});

console.log($(f));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id ="list">

</ul>

Answer 1

基本的经验法则是在处理 UI 相关内容时不要使用箭头函数。比如，作为事件处理程序等。因为箭头函数会将其执行上下文绑定到自身。它不能以任何方式被覆盖。

var f = $('#list li').filter(function() {
  return $(this).data('test').obj1 == 'any'
});

使用普通的匿名函数而不是箭头函数。如果你仍然想使用箭头函数，那么 this 将指向它的执行上下文。它将指向 SO 的执行程序中的 window 对象。