Question

控制台弹出："TypeError: tempItem is undefined [...] app.js:145:21" 尽管已经声明了tempItem（椭圆是我通过显示空间的方式，以防万一）。

作为参考，我是JS noobie，我正在研究电子商务网站如何处理其购物车机制，因为我想尝试自己的版本。有问题的机制是“从购物车叠加中添加商品数量”机制。

因此，乍一看，我认为这可能是某处打字错误造成的。好吧，没什么大不了的，我会稍作改动。经历了两个小时的痛苦，我无法自拔，因为我无法分辨自己做错了什么。一切似乎都按照我的计划进行了排列。这是有问题的代码段，从141行到149行：

        else if (event.target.classList.contains("fa-chevron-up")) {
                let addAmount = event.target;
                let id = addAmount.dataset.id;
                let tempItem = cart.find(item => item.id === id);
                    tempItem.amount = tempItem.amount + 1;
                Storage.saveCart(cart);
                this.setCartValues(cart);
                addAmount.nextElementSibling.innerText = tempItem.amount;
            }

因此，控制台将tempItem读为未定义，但是在代码中，我看到tempItem被声明为let tempItem...;，那有什么用呢？由于该错误，我用于添加机制的"fa-chevron-up"按钮什么也不做。我阅读并重新阅读了我的整个代码，以确保没有错别字。也许我正在阅读困难，或者我太累了。我为应该是一个不言自明的问题而苦苦挣扎。以防万一我不not心，这是我一直瞪着的代码的屏幕截图：https://imgur.com/a/q1KJNAJ 预先谢谢你。

编辑1：感谢您的答复。因此，这是购物车的样子，在第一张图片中：https://imgur.com/a/kwnhegO 我可以在此处添加内容，“删除”和“清除购物车”按钮可以按计划工作，但是人字形不起作用。他们什么都不做。同一链接中包含的第二张照片是我要插入的html格式。

Answer 1

Array#find returns undefined，当它检查每个元素并没有找到匹配项时。

尝试测试是否存在匹配项：

<div class="btn-group btn-group-sm">
<?php echo form_open('edit_files', 'class="btn-group"');?>
    <button type="submit" class="btn btn-primary" name="id">Edit</button>
</form>
<?php echo form_open('view_files', 'class="btn-group"');?>
    <button type="submit" class="btn btn-success" name="id">View</button>
</form>

Answer 2

除非以下查找成功，否则您将获得未定义的响应。

let tempItem = cart.find(item => item.id === id);

此外，因为您使用的是更严格的===运算符，所以item.id和id必须具有相同的类型。

所以有两个原因导致返回此未定义的值：

购物车中没有与该ID相匹配的商品。
item.id和id的类型不同（例如字符串和数字）。

无法排查TypeError（JS）

2 个答案: