循环遍历数组并删除特定类型的元素 d3.js

Question

data 是一个包含不同类型元素的数组。我想遍历这个数组并删除所有类型为A 和类型B 的元素。这是我目前所拥有的：

for(i=0;i<data.length;i++){ 
    if (i.type === "A"|| i.type === "B") {
        data.splice(i, 1);
    }   
}

即使有些是A 或B 类型，它也不会删除任何内容。

谁能告诉我为什么会出现这种错误以及我应该如何解决它！

提前致谢！

Answer 1

问题

您的代码中实际上有两个错误：

1. 您正在向前循环。如果要在遍历数组元素的同时拼接数组，则需要向后循环。
2. i.type 应该是 data[i].type。 i 只是一个数字，甚至没有 type 属性。

固定代码

for(var i = data.length-1; i >= 0; i--){ 
    if (data[i].type === "A"|| data[i].type === "B") {
        data.splice(i, 1);
    }   
}

演示

var data = [
    { value : 'Tom', type : 'A' },
    { value : 'Susan', type : 'C' },
    { value : 'Frank', type : 'B' },
    { value : 'Hakeem', type : 'A' },
    { value : 'Ali', type : 'C' },
    { value : 'Thomas', type : 'B' },
    { value : 'An', type : 'D' }
];

for(var i = data.length-1; i >= 0; i--){ 
    if (data[i].type === "A"|| data[i].type === "B") {
        data.splice(i, 1);
    }   
}

document.body.innerHTML = JSON.stringify(data);

（另见this Fiddle）

---

注意

如果您实际上将获得更好的性能 - 而不是使用 data[i].type === "A"|| data[i].type === "B" 删除所有对象 - 您只需创建一个新数组并复制原始数组数组中的所有值 data[i].type !== "A" && data[i].type !== "B" ：

var data = [
    { value : 'Tom', type : 'A' },
    { value : 'Susan', type : 'C' },
    { value : 'Frank', type : 'B' },
    { value : 'Hakeem', type : 'A' },
    { value : 'Ali', type : 'C' },
    { value : 'Thomas', type : 'B' },
    { value : 'An', type : 'D' }
];

var copy = [];
for(var i = 0; i < data.length; i++){ 
    if (data[i].type !== "A" && data[i].type !== "B") {
        copy.push(data[i]);
    }   
}
data = copy;

document.body.innerHTML = JSON.stringify(data);

（另见this Fiddle）

Answer 2

在拼接的时候循环数组是有问题的，这里改用Array.filter：

var filteredData = data.filter(function(d){
    return !(i.type === "A"|| i.type === "B");
});