javascript - 为什么过滤器返回相同的数组？

Question

我需要使用过滤器删除一个项目，但它返回相同的数组...我是新来的 react ..所以请记住这一点和答案:)

*方法*

removeItemHandler = (id) => {
    if (this.state.selectedProducts.length <= 0){
      return
    }
      let carsSelected = this.state.selectedProducts.filter(item => {
        return item !== id})
        debugger;
        console.log(`item removed`, carsSelected);}

调试器(点击了 3 个项目)

  removeItemHandler = (id) => { ***id = {id: 2, name: "Bugatti", price: 3200000, description: "Extremely Fast", total: 0, …}
***
    if (this.state.selectedProducts.length <= 0){
      return
    }
      let carsSelected = this.state.selectedProducts.filter(item => ***{ carsSelected = (3) [{…}, {…}, {…}]***

        return item !== id}) ***id = {id: 2, name: "Bugatti", price: 3200000, description: "Extremely Fast", total: 0, …}***
        debugger;

console.log 返回相同的数组

Answer 1

您应该按 item.id 而不是 item 进行过滤

let carsSelected = this.state.selectedProducts.filter(item => item.id !== id.id)
//                                                                 ^^

请注意，您正在将对象作为 id 参数传递。你正在比较两个对象。这在 JavaScript 中并不容易完成。对象平等并不像看上去那样。例如:

var firstObject = {
    id: 1,
    foo: "foo",
    bar: "bar"
};

var secondObject = {
    id: 1,
    foo: "foo",
    bar: "bar"
};


console.log(firstObject === secondObject); // with triple "="
// Output: false

console.log(firstObject == secondObject);  // with double "="
// Output: false

即使两个对象具有相同的属性和相同的值，它们也不是相同的对象。

您可以比较它们的唯一标识符，而不是比较整个对象

进一步阅读:Object comparison in JavaScript