如何限制JavaScript.filter结果?

如何限制JavaScript.filter结果?,javascript,jquery,ecmascript-6,Javascript,Jquery,Ecmascript 6,我正在用JavaScript创建一个简单的购物车作为练习。当用户单击从购物车数组中删除一个项目时,我使用.filter按ID删除产品对象。当然,.filter将从数组中删除ID为x的所有对象。我相信实现我想要的最好的方法是从对象数组中最多移除一个具有所述ID的对象。有人知道如何做到这一点/更合适的解决方案吗 JSFiddle: 使用和: 不过,最好记录购物车中每种商品的数量,这样会更容易向用户显示,并且使这种情况更易于管理 这可能是一个什么样的例子 let shoppingCart = [

我正在用JavaScript创建一个简单的购物车作为练习。当用户单击从购物车数组中删除一个项目时,我使用.filter按ID删除产品对象。当然,.filter将从数组中删除ID为x的所有对象。我相信实现我想要的最好的方法是从对象数组中最多移除一个具有所述ID的对象。有人知道如何做到这一点/更合适的解决方案吗

JSFiddle:

使用和:

不过,最好记录购物车中每种商品的数量,这样会更容易向用户显示,并且使这种情况更易于管理

这可能是一个什么样的例子

let shoppingCart = [
  { itemId: 1, count: 5 },
  { itemId: 2, count: 3 }
];

function decreaseCount(itemId) {
  const shoppingCartItem = shoppingCart.find(x => x.itemId === itemId);
  if (shoppingCartItem) {
    if (--shoppingCartItem.count < 1) {
      removeItem(itemId);
    }
  }
}

// slightly less efficient, but uses immutable objects, map, and filter
function decreaseCountImmutable(itemId) {
  shoppingCart = 
   shoppingCart
     .map(x =>  x.itemId !== itemId ? x: ({ ...x, count: x.count -1 }))
     .filter(x => x.count > 0);
}

function increaseCount(itemId) {
  const shoppingCartItem = shoppingCart.find(x => x.itemId === itemId);
  if (shoppingCartItem) {
    shoppingCartItem.count++;
  } else {
    shoppingCart.push({ itemId, count: 1 });
  }
}

// uses immutable objects and map
function increaseCountImmutable(itemId) {
  let foundItem = false;
  shoppingCart = shoppingCart.map(x =>  x.itemId !== itemId ? x: (foundItem = true) && ({ ...x, count: x.count + 1 }));
  if (!foundItem) {
    shoppingCart.push({ itemId, count: 1 });
  } 
}

function removeItem(itemId) {
  shoppingCart = shoppingCart.filter(x => x.itemId !== itemId);
}

首先,为什么购物车中有多个具有相同id的项目?标识符是一个名称,用于标识,即标记唯一对象或唯一对象类别的标识,其中对象或类别可能是想法、物理可数对象或其类别,或物理上不可计数的物质或其类别。缩写ID通常指的是您购物车中的每个商品都应有一个唯一的标识。它通常不是产品ID。是的,远不是理想的。我们仍在观察这一切的结果,并将确保改变这一点。谢谢你们。shoppingCart=shoppingCart.index,1;不行。splice对调用它的数组进行变异,并返回删除的值。顺便说一句,项计数表示法可以而且应该很好地使用map和filter。为每个项添加一个计数是一个更好的解决方案,谢谢。任何人都可以提供一个带有映射和过滤器的示例吗?我似乎无法让它工作。@LiamMacmillan我将更新此示例以解决所有评论,并将示例改为使用map/filter。@CallumMorrisson谢谢,非常感谢。我决定直接增加对象数组中的计数,如下所示:
const index = shoppingCart.findIndex(item => item.id === thisItemId);
if (index > -1) {
  shoppingCart.splice(index, 1);
}
let shoppingCart = [
  { itemId: 1, count: 5 },
  { itemId: 2, count: 3 }
];

function decreaseCount(itemId) {
  const shoppingCartItem = shoppingCart.find(x => x.itemId === itemId);
  if (shoppingCartItem) {
    if (--shoppingCartItem.count < 1) {
      removeItem(itemId);
    }
  }
}

// slightly less efficient, but uses immutable objects, map, and filter
function decreaseCountImmutable(itemId) {
  shoppingCart = 
   shoppingCart
     .map(x =>  x.itemId !== itemId ? x: ({ ...x, count: x.count -1 }))
     .filter(x => x.count > 0);
}

function increaseCount(itemId) {
  const shoppingCartItem = shoppingCart.find(x => x.itemId === itemId);
  if (shoppingCartItem) {
    shoppingCartItem.count++;
  } else {
    shoppingCart.push({ itemId, count: 1 });
  }
}

// uses immutable objects and map
function increaseCountImmutable(itemId) {
  let foundItem = false;
  shoppingCart = shoppingCart.map(x =>  x.itemId !== itemId ? x: (foundItem = true) && ({ ...x, count: x.count + 1 }));
  if (!foundItem) {
    shoppingCart.push({ itemId, count: 1 });
  } 
}

function removeItem(itemId) {
  shoppingCart = shoppingCart.filter(x => x.itemId !== itemId);
}