从javascript数组中删除项目答案

【问题标题】：Removing items from javascript array从javascript数组中删除项目
【发布时间】：2016-09-01 06:38:15
【问题描述】：

我有这个对象数组：

$scope.frequencies = [{Id:124,clientId:3,name:'qqq'}, 
                      {Id:589,clientId:1,name:'www'}, 
                      {Id:45,clientId:3, name:'eee'},
                      {Id:567,clientId:1,name:'rrr'},
                      {Id:45,clientId:3,name:'eee'},
                      {Id:567,clientId:7,name:'rrr'}]

我需要从上面的数组中删除所有项目，除了 clientId = 3。

我该如何实现它？

【问题讨论】：

你能展示一下到目前为止你尝试了什么吗？
javascript - remove array element on condition的可能重复

标签： javascript lodash

【解决方案1】：

不要删除而是重新分配

var $scope = {};

$scope.frequencies = [{Id:124,clientId:3,name:'qqq'}, 
                      {Id:589,clientId:1,name:'www'}, 
                      {Id:45,clientId:3, name:'eee'},
                      {Id:567,clientId:1,name:'rrr'},
                      {Id:45,clientId:3,name:'eee'},
                      {Id:567,clientId:7,name:'rrr'}];

$scope.frequencies = $scope.frequencies.filter(item => item.clientId === 3);

console.log($scope.frequencies);

【讨论】：

拜托，你应该让 OP 分享他的努力。这是一个非常普遍的问题，你不应该回答这样的问题。
Array#splice 用于就地更改 - 只是说，因为您不能总是重新分配数组而不会产生不必要的副作用

【解决方案2】：

你可以简单地使用这个代码sn-p：

 $scope.frequencies = $scope.frequencies.filter((item)=> item.Id!=3);

【讨论】：

你为什么使用.splice()？ a.length 中的 a 是什么？
这是错误的，我编辑了它，而不是 a.length 它是 $scope.frequencies.length
好的，这让我回到“你为什么使用.splice()？这是多余的，因为使用参数(0, $scope.frequencies.length)，它的return值将是所有项目来自.filter() 生成的数组，所以没有它你会得到相同的结果......
是的，你是对的，它是多余的，不需要拼接。我们可以简单地将过滤器值分配给 $scope.frequencies。

【解决方案3】：

在 lodash 中，您可以使用 _.remove(array, [predicate=_.identity])。

从array 中删除所有predicate 为其返回真值的元素，并返回已删除元素的数组。谓词使用三个参数调用：(value, index, array).

var $scope = {};

$scope.frequencies = [{ Id: 124, clientId: 3, name: 'qqq' }, { Id: 589, clientId: 1, name: 'www' }, { Id: 45, clientId: 3, name: 'eee' }, { Id: 567, clientId: 1, name: 'rrr' }, { Id: 45, clientId: 3, name: 'eee' }, { Id: 567, clientId: 7, name: 'rrr' }];

_.remove($scope.frequencies, a => a.clientId !== 3);

console.log($scope.frequencies);

.as-console-wrapper { max-height: 100% !important; top: 0; }

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案4】：

使用过滤器方法，该方法基于比较返回满足过滤器的元素数组。在 ES5 上：

$scope.frequencies.filter(function(element){
   return element.clientId == 3; 
})

在较新的 ES6 上：

$scope.frequencies.filter( element => element.clientId != 3)

检查过滤器文档：filter

【讨论】：