減去幾個產品數量和Array.Splice不是函數

問題在於subtractQuantity函數。例如，當我添加兩個產品時，我點擊了第一個產品的減去數量按鈕，第二個產品也減去了它的數量。它應該是第一個減去數量的產品，因爲我點擊了第一個產品的減數按鈕。第二個問題是當數量爲0時，它應該自動刪除產品，但錯誤說明array.splice不是函數。 PS：我使用的EcmaScript 6，請自由地指導我如果我不使用ECMAScript 6或什麼來改善我的代碼減去幾個產品數量和Array.Splice不是函數

const cart = {}; 
 

 
function AddtoCart(productid, description, quantity, price) { 
 
    if (cart[productid]) { 
 
    cart[productid].qty += quantity; 
 
    } else { 
 
    cart[productid] = { 
 
     id: productid, 
 
     desc: description, 
 
     qty: quantity, 
 
     price: price 
 
    }; 
 
    } 
 
    calculateGrandTotal(); 
 
    document.getElementById("total").innerHTML = GrandTotal; 
 
    console.log(GrandTotal); 
 
    viewCart(); 
 
    
 
    } 
 
    function subtractQuantity(productid){ 
 
     if(cart[productid].qty > 0){ 
 
     cart[productid].qty--; 
 
     } 
 
     if (cart[productid].qty == 0) { 
 
     delete cart[productid]//Remove from cartreturn false; 
 
     } 
 
    viewCart(); 
 
    } 
 

 
function calculateGrandTotal(){ 
 
    GrandTotal = 0; 
 
    for(let productid in cart){ 
 
     if(cart.hasOwnProperty(productid)){ 
 
      GrandTotal += parseFloat(cart[productid].price) * parseInt(cart[productid].qty); 
 
     } 
 
    } 
 
} 
 
function viewCart() { 
 
    let tbody = document.getElementById('cartsBody'); 
 
    tbody.innerHTML = ''; 
 
    Object.values(cart).forEach(content => { 
 
    tbody.innerHTML += `<td>${ content.id }</td> 
 
         <td>${ content.desc }</td> 
 
         <td>${ content.qty }</td> 
 
         <td>${ content.price }</td> 
 
         <td>${ content.qty * content.price }</td> 
 
         <td><button type='submit' onClick='subtractQuantity(${content.id})'>subtract Quantity</button></td>`; 
 
    }); 
 
}

<script src="script.js"></script> 
 

 
<input type="button" value="Laptop" onclick="AddtoCart('132','Macbook Pro', 1, 79000,0)" /> 
 
<input type="button" value="Phone" onclick="AddtoCart('456','Iphone 5S', 1, 18000,0)" /> 
 
<input type="button" value="Camera" onclick="AddtoCart('789','Nikon 3D00', 1, 25000,0)" /> 
 

 
<table border="1" id="cartsTable"> 
 
    <thead> 
 
    <tr> 
 
     <th>Product ID</th> 
 
     <th>Product Description</th> 
 
     <th>Quantity</th> 
 
     <th>Price</th> 
 
     <th>Total</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody id="cartsBody"> 
 
    </tbody> 
 
</table> 
 
<h4>Total:</h4> 
 
<p id="total"></p>

來源

2017-07-15 Joseph

我想是因爲車是一個對象，拼接是數組 –

@AshtonMorgan。是的，這是問題所在。你可以幫我嗎？ – Joseph

阿什頓說的是正確的。你不能拼接對象屬性。改爲使用delete或爲購物車創建數組。 – Janne

工作液

const cart = {}; 
 

 
function AddtoCart(productid, description, quantity, price) { 
 
    if (cart[productid]) { 
 
    cart[productid].qty += quantity; 
 
    } else { 
 
    cart[productid] = { 
 
     id: productid, 
 
     desc: description, 
 
     qty: quantity, 
 
     price: price 
 
    }; 
 
    } 
 
    
 
    document.getElementById("total").innerHTML = calculateGrandTotal(); 
 
    console.log(GrandTotal); 
 
    viewCart(); 
 
    
 
    } 
 
    function subtractQuantity(productid){ 
 
     if(cart[productid].qty > 0){ 
 
     cart[productid].qty--; 
 
     } 
 
     if (cart[productid].qty == 0) { 
 
     delete cart[productid]//Remove from cartreturn false; 
 
     } 
 
     document.getElementById("total").innerHTML = calculateGrandTotal(); 
 
    viewCart(); 
 
    } 
 

 
function calculateGrandTotal(){ 
 
    GrandTotal = 0; 
 
    for(let productid in cart){ 
 
     if(cart.hasOwnProperty(productid)){ 
 
      GrandTotal += Number.parseFloat(cart[productid].price) * Number.parseInt(cart[productid].qty); 
 
     } 
 
    } 
 
    return GrandTotal; 
 
} 
 
function viewCart() { 
 
    let tbody = document.getElementById('cartsBody'); 
 
    tbody.innerHTML = ''; 
 
    Object.values(cart).forEach(content => { 
 
    tbody.innerHTML += `<td>${ content.id }</td> 
 
         <td>${ content.desc }</td> 
 
         <td>${ content.qty }</td> 
 
         <td>${ content.price }</td> 
 
         <td>${ content.qty * content.price }</td> 
 
         <td><button type='submit' onClick='subtractQuantity(${content.id})'>subtract Quantity</button></td>`; 
 
    }); 
 
}

<script src="script.js"></script> 
 

 
<input type="button" value="Laptop" onclick="AddtoCart('132','Macbook Pro', 1, 79000,0)" /> 
 
<input type="button" value="Phone" onclick="AddtoCart('456','Iphone 5S', 1, 18000,0)" /> 
 
<input type="button" value="Camera" onclick="AddtoCart('789','Nikon 3D00', 1, 25000,0)" /> 
 

 
<table border="1" id="cartsTable"> 
 
    <thead> 
 
    <tr> 
 
     <th>Product ID</th> 
 
     <th>Product Description</th> 
 
     <th>Quantity</th> 
 
     <th>Price</th> 
 
     <th>Total</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody id="cartsBody"> 
 
    </tbody> 
 
</table> 
 
<h4>Total:</h4> 
 
<p id="total"></p>

來源

2017-07-15 06:14:17 taha

總計低於未更新點擊時減去數量。請檢查編輯片段 – Joseph

@Joseph：現在！滿意？：D – taha

好的。謝謝。請upvote我的問題 – Joseph

相反的：

cart.splice()

使用：

delete cart[productid]

拼接是爲數組，另一種解決方案是mak荷蘭國際集團車的數組：

const cart = []

編輯

對於第一個問題，而不是迭代低谷所有車的屬性，送你需要降低cuantity項目的ID：

onClick='subtractQuantity(' +content.id+')'

並在您的功能。減去只是減少或刪除：

function subtractQuantity(productid){ 

    if(cart.hasOwnProperty(productid)){ 
     cart[productid].qty--; 
    } 
    if (cart[productid].qty == 0) { 
      delete cart[productid]//Remove  from cart 

} 
calculateGrandTotal(); 
viewCart();

}

來源

2017-07-15 04:57:23

呃，我有一個錯字，它的productid不是productId –

是它的工作，但第一個問題尚未解決。請檢查我的問題上面。 – Joseph

總計不還更新時減去數量 – Joseph

splice是Array對象的一種方法。如果你想使用它的陣列狀結構

Array.prototype.splice.call(cart, productid,1)

作爲去除從購物車中的條目，你必須通過this（產品要降低其量）的處理程序onClick='subtractQuantity(this)'和函數聲明function subtractQuantity(this)

ps：如何應用這些指令取決於您。祝你好運

來源

2017-07-15 04:58:29 taha

對不起，我不知道如何應用此。你能幫我做Array.prototype.splice.call（cart，productid，1）嗎？ – Joseph

減去幾個產品數量和Array.Splice不是函數

回答

相關問題