如何从数组中删除一个特定值? 类似 :

array.remove(value);

我必须使用核心核心核心JavaScript。 不允许框架 。


当前回答

业绩 业绩业绩 业绩业绩

今天(2019-12-09),我为选择的解决方案对macOS v10.13.6(高塞拉利昂)进行性能测试。delete(A),但与其他方法相比,我并不使用它,因为它在数组中留下了空白。

结 结 结 结 结 结 结

  • 最快的解决方案是array.splice(C) (小型阵列有第二次的Safeare除外)
  • 以大数组盟誓,array.slice+splice(H) 是Firefox和Safari最快、不可改变的解决办法;Array.from(B) 铬含量最快
  • 可变溶液通常比不可变的更快1.5x-6x
  • 令人惊讶的是,变异解决办法(C)慢于不可变解决办法(G)

详细细节

在测试中,我以不同的方式从数组中删除中间元素。A、C本地的解决方案。B、D、E、F、G、H解决方案是不可改变的。

包含 10 元素的阵列结果

Enter image description here

在铬array.splice(C) 是当地最快的解决办法。array.filter(D) 是最快、不可改变的解决方案。array.slice(F). 您可以在机器上进行测试在这里.

带有 1 000 000 元素的阵列结果

Enter image description here

在铬array.splice(C) 是最迅速的就地解决办法delete(C) 的快速性相似,但它在数组中留下了一个空位(因此它不执行“完全移除”)。array.slice-splice(H) 是最快的不可改变的解决方案。 最慢的是array.filter(D和E). 您可以在您的机器上进行测试。在这里.

var a = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
var log = (letter,array) => console.log(letter, array.join `,`);

function A(array) {
  var index = array.indexOf(5);
  delete array[index];
  log('A', array);
}

function B(array) {
  var index = array.indexOf(5);
  var arr = Array.from(array);
  arr.splice(index, 1)
  log('B', arr);
}

function C(array) {
  var index = array.indexOf(5);
  array.splice(index, 1);
  log('C', array);
}

function D(array) {
  var arr = array.filter(item => item !== 5)
  log('D', arr);
}

function E(array) {
  var index = array.indexOf(5);
  var arr = array.filter((item, i) => i !== index)
  log('E', arr);
}

function F(array) {
  var index = array.indexOf(5);
  var arr = array.slice(0, index).concat(array.slice(index + 1))
  log('F', arr);
}

function G(array) {
  var index = array.indexOf(5);
  var arr = [...array.slice(0, index), ...array.slice(index + 1)]
  log('G', arr);
}

function H(array) {
  var index = array.indexOf(5);
  var arr = array.slice(0);
  arr.splice(index, 1);
  log('H', arr);
}

A([...a]);
B([...a]);
C([...a]);
D([...a]);
E([...a]);
F([...a]);
G([...a]);
H([...a]);
This snippet only presents code used in performance tests - it does not perform tests itself.

浏览器比较:Chrome v78.0.0,Safari v.13.0.4和Firefox v71.0.0

Enter image description here

其他回答

以下是几个方法使用 JavaScript 从数组中删除项目.

描述的所有方法不变换原始数组,而不是创造一个新的。

如果您知道某个项目的索引

假设您有一个数组,而您想要删除位置中的项目i.

一种方法是使用slice():

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const i = 3
const filteredItems = items.slice(0, i).concat(items.slice(i+1, items.length))

console.log(filteredItems)

slice()创建新数组, 使用它收到的索引 。 我们简单地创建一个新数组, 从开始到要删除的索引, 并且将另一个数组从我们删除的后第一个位置集中到数组的末尾 。

如果您知道数值

在这种情况下,一个好的选择是使用filter(),它提供了更多宣示方针:

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valueToRemove = 'c'
const filteredItems = items.filter(item => item !== valueToRemove)

console.log(filteredItems)

此选项使用 ES6 箭头函数。 您可以使用传统函数支持旧的浏览器 :

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valueToRemove = 'c'
const filteredItems = items.filter(function(item) {
  return item !== valueToRemove
})

console.log(filteredItems)

或者你可以使用 Babel 将ES6代码转换回ES5, 使旧浏览器更容易消化, 而在您的代码中写入现代 JavaScript 。

删除多个项目

如果不是单项,而是要删除许多项,会怎么样?

让我们找到最简单的解决方案

按指数分列的指数

您可以在序列中创建函数并删除项目 :

const items = ['a', 'b', 'c', 'd', 'e', 'f']

const removeItem = (items, i) =>
  items.slice(0, i-1).concat(items.slice(i, items.length))

let filteredItems = removeItem(items, 3)
filteredItems = removeItem(filteredItems, 5)
//["a", "b", "c", "d"]

console.log(filteredItems)

以数值计

您可以在回溯函数中搜索包含内容 :

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valuesToRemove = ['c', 'd']
const filteredItems = items.filter(item => !valuesToRemove.includes(item))
// ["a", "b", "e", "f"]

console.log(filteredItems)

避免突变原始数组

splice()(不与slice()变换原始数组,并应避免。

(最初张贴在我的网站上)https://flaviocopes.com/how-to-remove-item-from-array/)

我测试过splicefilter查看哪个速度更快 :

let someArr = [...Array(99999).keys()] 

console.time('filter')
someArr.filter(x => x !== 6666)
console.timeEnd('filter')

console.time('splice by indexOf')
someArr.splice(someArr.indexOf(6666), 1)
console.timeEnd('splice by indexOf')

在我的机器上splice更快。这有道理,因为splice仅编辑现有的数组,而filter创建新数组。

尽管如此,filter逻辑上更清洁(容易阅读),更适合使用不可改变状态的编码风格。所以由你决定是否进行这种权衡决定。

您可以为此创建一个原型。只需通过数组元素和您想要从数组元素中删除的值:

Array.prototype.removeItem = function(array,val) {
    array.forEach((arrayItem,index) => {
        if (arrayItem == val) {
            array.splice(index, 1);
        }
    });
    return array;
}
var DummyArray = [1, 2, 3, 4, 5, 6];
console.log(DummyArray.removeItem(DummyArray, 3));

大部分答案都用...

  1. 索引和交点
  2. 删除删除
  3. 过滤过滤器
  4. 常设经常经常 经常经常for loop

虽然所有解决办法都应采用这些方法,但我认为我们可以使用字符串操作.

需要注意的关于这一解决办法的要点 -- --

  1. 它会在数据中留下漏洞(可以通过额外的过滤器来清除)
  2. 此解决方案不仅用于原始搜索值,而且用于工作对象.

诀窍是...

  1. stringify数据集和搜索值
  2. 用空字符串替换输入数据集中的搜索值
  3. 返回返回split分隔符上的数据,.
    remove = (input, value) => {
        const stringVal = JSON.stringify(value);
        const result = JSON.stringify(input)

        return result.replace(stringVal, "").split(",");
    }

这里创建了一个测试对象和数字 JSF 的 JSF 。 。 。https://jsfiddle.net/4t7zhkce/33/

检查remove方法在小提琴中。

使用过滤过滤器这是达到这一要求的优雅方式。filter将不改变原始数组。

const num = 3;
let arr = [1, 2, 3, 4];
const arr2 = arr.filter(x => x !== num);
console.log(arr); // [1, 2, 3, 4]
console.log(arr2); // [1, 2, 4]

您可以使用filter然后将结果指定为原始数组,如果你想实现突变清除行为的话。

const num = 3;
let arr = [1, 2, 3, 4];
arr = arr.filter(x => x !== num);
console.log(arr); // [1, 2, 4]

顺便说一句,filter将删除在条件中匹配的所有事件( 不只是第一次发生) , 正如您在下面的示例中看到的一样

const num = 3;
let arr = [1, 2, 3, 3, 3, 4];
arr = arr.filter(x => x !== num);
console.log(arr); // [1, 2, 4]

万一您只想删除第一种情况,您可以使用复盘方法

const num = 3;
let arr = [1, 2, 3, 3, 3, 4];
const idx = arr.indexOf(num);
arr.splice(idx, idx !== -1 ? 1 : 0);
console.log(arr); // [1, 2, 3, 3, 4]