javascript - 未捕获的类型错误 : String is not a function only after second function call

Question

我正在尝试用js制作一个简单的购物车(仅供展示)。我创建了一个函数来将对象存储在购物车中，每个按钮都会将参数传递给“添加到购物车”函数，该函数使用参数创建一个 CartItem 对象，并存储在 cart< 中 数组。它第一次工作得很好，但我在以下行中收到Uncaught type error: String is not a function:var a = new CartItem(title,price);

相关js如下:

var cart = [];
function CartItem(title, price) {
    this.title = title;
    this.price = price;
    this.getTitle = function() {
        return this.title;
    };
    this.getPrice = function() {
        return this.price;
    };
}

function addToCart(title, price) {
    var a = new CartItem(title, price);
    cart.push(a);
    /* update cart display */
    for (CartItem in cart) {
        var itemDiv = document.createElement("div");
        itemDiv.className = "cartItem";
        itemDiv.innerHTML = title + " - $" + price;
        document.getElementById("cartDisplay").appendChild(itemDiv);
    }
}

和 html:

        <div class="cartDisplay" id="cartDisplay">
            <p>All photographs are printed on 11"x17" Fujitsu Archival Quality stock.</p>
            <h3>Your Cart</h3>
        </div>
        <div class="storeGrid">
            <div class="storeItem">
                <img src="res/Photos/O_IMG_0002.jpg" class="storeImg"/>
                <div class="storeItemDesc">
                    <p>Price: $300</p>
                    <p>Description goes here.</p>
                    <a href="javascript:addToCart('Street with Steeple', 300, 1);" class="addToCart"><div class="addToCartDiv" id="1">Add to cart
                        <i class="fa fa-shopping-cart"></i></div></a>
                </div>
            </div>
        </div>

Answer 1

行 for(CartItem in cart) { 对我来说有点奇怪。我的猜测是，JS 需要一个包含 CartItem 的变量名，因此它会在全局范围内生成一个变量名。然后，当它尝试计算 var a = new CartItem(title,price); CartItem 是一个全局变量，而不是构造函数。

无论如何，您不应该使用 for in 来循环数组。您可以在 python 或 java 中执行此操作，但在 javascript 中，它用于枚举对象的属性。请改用标准循环。

MDN for..in 的描述:

The for..in statement iterates over the enumerable properties of an object, in arbitrary order. For each distinct property, statements can be executed.