Javascript TypeError：无法读取未定义的属性“indexOf”答案

【问题标题】：Javascript TypeError: Cannot read property 'indexOf' of undefinedJavascript TypeError：无法读取未定义的属性“indexOf”
【发布时间】：2017-01-27 14:09:31
【问题描述】：

在这段代码中，我想从cart_products 数组中删除一个元素。

var cart_products = ["17^1", "19^1", "18^1"];
var product = 17;

$.each(cart_products,function(key, item) {
    if(item.indexOf(product+"^") !== -1){
        cart_products.splice(key, 1);
    }
});

但我在 Google Chrome 控制台中收到此错误：

未捕获的类型错误：无法读取未定义的属性“indexOf”

代码有问题吗？

感谢您的帮助。

【问题讨论】：

cart_products 里面有什么？
cookie 的值是多少？
仅供参考。您不需要使用 jQuery 来遍历数组中的每个元素。 Array 原型已经有了forEach() 方法。
@MysterX indexOf() 也是一个字符串方法。没有建议 OP 正在寻找在循环内使用数组

标签： javascript jquery

【解决方案1】：

问题是您正在修改数组，而 jQuery 的 $.each 正在循环它，所以当它到达末尾时，曾经位于索引 2 的条目是不再存在。 （我承认我有点惊讶$.each 的行为方式，但我至少五年没有使用过$.each，所以......）

如果目标是从数组中删除匹配项，则更好的选择是filter：

var cart_products = ["17^1", "19^1", "18^1"];
var product = 17;

cart_products = cart_products.filter(function(item) {
    return item.indexOf(product+"^") === -1;
});
console.log(cart_products);

...或者，如果重要的是就地修改数组而不是创建新数组，请使用无聊的 for 循环 as Andreas points out 在数组中循环向后，这样它就不会删除东西时无关紧要：

var cart_products = ["17^1", "19^1", "18^1"];
var product = 17;

var target = product + "^";
for (var index = cart_products.length - 1; index >= 0; --index) {
  if (cart_products[index].indexOf(target) !== -1) {
    cart_products.splice(index, 1);
  }
}
console.log(cart_products);

【讨论】：

嗯...哇，伙计们。我认为答案已经得到了足够的支持。 ;-)
@Andreas: :-) 就是这样。而且它比我的findIndex 更好，它只会找到并删除first。
一个完美的答案。谢谢你。

【解决方案2】：

首先，您不需要为此使用一个 jQuery。其次，更改您正在操作的数组不是一个好主意。如果您尝试从数组中删除元素，请使用过滤器。过滤器具有以下签名：

someArray.filter(function(item, index, array) {
  // return a value that is truthy to keep an item or falsey to remove it
})

Filter 返回一个新数组，其中仅包含与您想要的值匹配的值。这意味着您不会弄乱原始数组，这无论如何都是个好主意。在您的情况下，它看起来像这样：

var filteredProducst = cart_products.filter(function(item) {
  return item.indexOf(product + "^")
})

【讨论】：