使用 Lodash 删除数组中的元素

Removing elements in an array using Lodash

我有这个数组:

var fruits = ['Apple', 'Banana', 'Orange', 'Celery'];

我使用 Lodash 的 remove 是这样的:

_.remove(fruits, function (fruit) {
  return fruit === 'Apple' || 'Banana' || 'Orange';
})

结果是 ['Apple', 'Banana', 'Orange', 'Celery'],而我预计是 ['Apple', 'Banana', 'Orange']。为什么会这样?

使用您要比较的值数组,并检查返回的索引是否大于 -1。这表示在集合中找到了评估的值。

_.remove( fruits, function ( fruit ) {
  return _.indexOf( [ "Apple", "Banana", "Orange" ], fruit ) >= 0;
});

或者您可以使用 lo-dash's _.contains method 来获得布尔值响应。

您采用的方法的问题在于您没有将 fruit 与这些字符串中的每一个进行比较;相反,唯一进行的比较是 fruit"Apple",之后你就自己强制字符串了。

非空字符串强制转换为 true (!!"Banana"),因此 truthy。因此,下面的条件总是在"Banana"处短路(除非fruit严格等于"Apple"),返回true

return fruit === "Apple" || 'Banana' || "Orange";

问题不在于 Lo-Dash;您的问题出在回调函数中的条件。这个:

return fruit === 'Apple' || 'Banana' || 'Orange';

正确吗。您需要实际比较 fruit 与每个字符串:

return fruit === 'Apple' || fruit === 'Banana' || fruit === 'Orange';

或者,可以使用另一个Lo-Dash函数让它更简洁一点:

_.remove(fruits, function (fruit) {
  return _.contains(['Apple', 'Banana', 'Orange'], fruit);
})

注意: 在 Lo-Dash 的最新版本中,_.contains 函数已被弃用。请使用_.includes

因为当 fruit"Celery" 时,您正在测试:

"Celery" === 'Apple' || 'Banana' || 'Orange'

计算结果为

false || true || true

true

您不能使用该语法。要么从长远来看:

_.remove(fruits, function (fruit) {
  return fruit === 'Apple' || fruit === 'Banana' || fruit === 'Orange'
});

或测试数组成员:

_.remove(fruits, function (fruit) {
  return _.indexOf(['Apple', 'Banana', 'Orange'], fruit) !== -1
});

这不限于JavaScript,实际上是一个常见的错误(例如this question

您可以使用 lodash 2.0 及更高版本_.pull的方法

var fruits = ['Apple', 'Banana', 'Orange', 'Celery'];

_.pull(fruits, 'Apple', 'Banana', 'Orange'); // ['Celery']

document.write(fruits);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.6.1/lodash.js"></script>

如果您想从另一个集合中删除一组项目,可以使用专门用于此目的的集合操作。 Lodash 有 https://lodash.com/docs/4.17.2#difference 接受两个数组参数 A 和 B 并且将 return 另一个数组包含 A 中不在 B 中的所有元素。

对于你的情况,你可以这样写

const fruits = ['Apple', 'Banana', 'Orange', 'Celery'];
const filteredFruits = _.difference(fruits, ['Apple', 'Banana', 'Orange']);

这将导致 ['Celery']