没有在循环中调用拼接，在数组中找不到id

Question

我正在尝试通过onClick元素（如deleteFavourite(2)）给出的参数来拼接数组。三个控制台日志显示：id（2），已触发消息和已保存的消息，但忽略了拼接消息。为什么不打击if？

功能：

deleteFavourite: function (id) {
    console.log(id);
    console.log("fired");
    var array = this.favourites;
    for (var i = 0; i < array.length; i++) {
        if (array[i] === id) {
            array.splice(i, 1);
            console.log("spliced");
        }
    }
    this.save();
    console.log("saved");
}

数组在Chrome中以这样的方式输出

Array(3)
0: {id: 0, title: "↵Page 0    ", url: "/page-0/"}
1: {id: 1, title: "↵Social media    ", url: "/social-media/"}
2: {id: 2, title: "↵Get involved    ", url: "/get-involved/"}
length: 3
__proto__: Array(0)

Answer 1

因为您正在使用包含普通对象的数组，所以您的控件应该是：

    deleteFavourite: function (id) {
    console.log(id);
    console.log("fired");
    var array = this.favourites;
    for (var i = 0; i < array.length; i++) {
        if (array[i].id === id) { 
            array.splice(i, 1);
            console.log("spliced");
        }
    }
    this.save();
    console.log("saved");
}

实际上，您希望将数组中的id与作为参数传递的int进行比较。

否则，您将一个对象（数组[i]是一个包含3个属性的对象）与一个int进行比较，这将永远不会为真。

Answer 2

我想你不需要为此循环你的阵列。为了使它工作，因为它试图不在if语句中将数组的整个部分与数字进行比较，而只是将数组的迭代与数字进行比较。在我看来，这应该首先检查数组的元素是否存在然后切片。

if (array[id]) {
    array.splice(id, 1);
    console.log("spliced");
}

Answer 3

尝试：

deleteFavourite: function (id) {
    console.log("deleteFavourite: ", id);
    var array = this.favourites;

    for (var i = 0; i < array.length; i++) {
        if (array[i].id === id) {  // <---- MY CHANGE
            array.splice(i, 1);
            console.log("spliced");
        }
    }
    this.save();
    console.log("saved");
}

您应该使用array[i].id，因为数组中项目的索引与实际的id索引不匹配。

使用ES2015 findIndex：

deleteFavourite: function (id) {
    var array = this.favourites,
        index = array .findIndex(item => item.id == id);

    if( index > -1 ){
        array.splice(index, 1);
        this.save();
    }
}