Javascript - 通过值删除数组项

Question

我的情况：

var id_tag = [1,2,3,78,5,6,7,8,47,34,90];

我想要执行delete where id_tag = 90并返回:

var id_tag = [1,2,3,78,5,6,7,8,47,34];

我该如何做到这一点？

- itsme

---

我认为问题标题应该是“JS - 在JavaScript中按值删除数组元素”。 - kta

@kta没错！你运用了你的脑力，标题自己改变了。魔法般的。 - User2

@User2：我确实相信魔法，但在这种情况下，作者在我写下第一条评论后更改了问题标题。 :) - kta

请参阅：通过值从数组中删除项目和从数组中删除特定元素？ - Bergi

请点击此处以查看：https://dev59.com/CG025IYBdhLWcg3w1ZoL#71332975 - Sahil Thummar

Answer 1

你需要使用JavaScript的Array splice方法：

var tag_story = [1,3,56,6,8,90],
    id_tag = 90,
    position = tag_story.indexOf(id_tag);

if ( ~position ) tag_story.splice(position, 1);

P.S. 如果你想了解那个酷炫的波浪线~ 缩写的解释，请参考这篇文章：

使用 ~ 波浪线与 indexOf 来检查数组中是否存在某个项。

---

Note: IE < 9 不支持数组上的 .indexOf()。如果你想确保你的代码能在 IE 中正常工作，你应该使用 jQuery 的 $.inArray() 来代替。

var tag_story = [1,3,56,6,8,90],
    id_tag = 90,
    position = $.inArray(id_tag, tag_story);

if ( ~position ) tag_story.splice(position, 1);

如果您想支持IE < 9，但是页面上还没有jQuery，那么没有必要仅仅为了使用$.inArray而使用它。您可以使用这个polyfill代替。

- Joseph Silber

---

安全网加一。 - alex

我不会仅为此目的包含jQuery。在MDN文档中提供了一个简单的indexOf函数。 - RobG

@RobG：完全正确。我只是假设他在问题标记中使用了[tag:jquery]，说明他已经在页面上使用了jQuery。 - Joseph Silber

如链接解释中的评论所述，请不要使用波浪符号。这样做没有明显的好处，反而会增加理解难度。 - Dustin Wyatt

波浪号并不酷。难以维护的代码才不酷！ - jperelli

Answer 2

如果您经常使用它（并且在多个数组上使用），请扩展Array对象以创建一个unset函数。

Array.prototype.unset = function(value) {
    if(this.indexOf(value) != -1) { // Make sure the value exists
        this.splice(this.indexOf(value), 1);
    }   
}

tag_story.unset(56)

- Pete

---

不要扩展原生JS对象。此外，OP想要返回已删除元素的新数组..最好返回新数组.. - Andre Figueiredo

Answer 3

tag_story.splice(tag_story.indexOf(id_tag), 1);

- Eli Grey

---

仔细看一下问题，似乎他想从数组中删除一个值，而不是一个索引。 - Peter Olson

@Peter 移除一个索引会同时移除关联的值。 - alex

这段代码很危险！如果找不到id_tag的值，它会删除数组中的最后一项！！你需要先检查id_tag是否被找到。请看我的答案。 - Joseph Silber

@Matt：当栈允许我的时候:)）（5分钟） - itsme

@Ispuk：这是一个非常不好的习惯。你不应该仅仅因为“它做我需要的事情”而使用代码。你应该仔细考虑每一行代码的后果！！！ - Joseph Silber

Answer 4

我喜欢使用过滤器：

var id_tag = [1,2,3,78,5,6,7,8,47,34,90];

// delete where id_tag = 90
id_tag = id_tag.filter(function(x) {
    if (x !== 90) {
      return x;
    }
});

- Aleck Landgraf

---

如果你在回调函数中使用 return x;，那么 filter 也会删除 Boolean(id_tag) = false 的项。我认为这并不是期望的结果。 - Robert

简写方式：id_tag = id_tag.filter(x => x !== 90); - klausf

Answer 5

作为一种变体

delete array[array.indexOf(item)];

如果你对 delete 操作符一无所知，不要使用它。

- disfated

---

不是一个好的解决方案，如果你使用 delete 关键字，最终数组中会有一个 undefined 元素。 - Afshin Mehrabani

这实际上正是我所需要的。结合使用array.forEach，我可以轻松地循环遍历已定义的索引。 - Olle Härstedt

提醒一下，删除操作会导致IE8或更低版本崩溃... - Mike_K

Answer 6

function removeValue(arr, value) {
    for(var i = 0; i < arr.length; i++) {
        if(arr[i] === value) {
            arr.splice(i, 1);
            break;
        }
    }
    return arr;
}

这可以这样调用：

removeValue(tag_story, 90);

- Peter Olson

---

这个不像我期望的那样工作... Eli的代码正是我所需要的，但它在IE上不起作用，请检查一下并检查你的代码，它们不能完成相同的工作 :( ... - itsme

这并不返回新数组... - Andre Figueiredo

@AndreFigueiredo 谢谢，我已经编辑好了。 - Peter Olson

Answer 7

这里是我使用的一些辅助函数：

Array.contains = function (arr, key) {
    for (var i = arr.length; i--;) {
        if (arr[i] === key) return true;
    }
    return false;
};

Array.add = function (arr, key, value) {
    for (var i = arr.length; i--;) {
        if (arr[i] === key) return arr[key] = value;
    }
    this.push(key);
};

Array.remove = function (arr, key) {
    for (var i = arr.length; i--;) {
        if (arr[i] === key) return arr.splice(i, 1);
    }
};

- yckart

---

OP想要返回新数组，他不想返回已删除的值。 - Andre Figueiredo

Answer 8

您需要使用.indexOf()和.splice()。示例代码如下：

tag_story.splice(tag_story.indexOf(90),1);

- J. Holmes

Answer 9

你可以使用 lodash.js。

_.pull(arrayName,valueToBeRemove);

在你的情况下： _.pull(id_tag,90);

- Gourav Sahare

---

请在您的答案中添加一些解释，可能还要包括您引用的链接。 - André Kool

希望这可以帮助@Andre，来自lodash文档。 - Gourav Sahare

Answer 10

var id_tag = [1,2,3,78,5,6,7,8,47,34,90]; 
var delete_where_id_tag = 90
    id_tag =id_tag.filter((x)=> x!=delete_where_id_tag); 

- Siddhartha