javascript - 解析URL参数并返回带有数组的javascript对象

我有以下带有参数的网址：

abc?carbs=pasta,rice,noodles&sauce=tomato&wine=red

如您所见，carbs是一个用逗号除的数组。
因此，通过使用以下代码：

sourceURL
    .slice(1)
    .split('&')
    .map(p => p.split('='))
    .reduce((obj, pair) => {
      const [key, value] = pair.map(decodeURIComponent);
      return { ...obj, [key]: value };
    }, {});

我得到这个不正确的结果：

{
    "carbs": "pasta,rice,noodles",
    "sauce": "tomato",
    "wine": "red"
}

我想要的是以下内容：（预期）

{
    "carbs": ["pasta","rice","noodles"],
    "sauce": "tomato",
    "wine": "red"
}

有人可以提供帮助吗？预先感谢，乔

更新：
谢谢大家，其中一些回复很好。不幸的是，如果carbs仅包含1个值，它们都将作为对象返回。

例如，如果我的URL是abc?carbs=noodles&sauce=tomato&wine=red，我应该得到：

{
    "carbs": ["noodles"], <----- still an array even with 1
    "sauce": "tomato",
    "wine": "red"
}

但是很遗憾，所有提供的解决方案均返回以下内容：

{
    "carbs": "noodles",
    "sauce": "tomato",
    "wine": "red"
}

抱歉，如果之前不清楚。谢谢乔

最佳答案

使用URLSearchParams解析字符串，然后使用.reduce获得所需的结果：

编辑

碳水化合物必须始终是一个数组，即使它是空的

在key内为.reduce添加一个检查：

const sourceURL = "abc?carbs=&sauce=tomato&wine=red";

const parsed = new URLSearchParams(sourceURL.split("?")[1]);

const result = [...parsed.entries()].reduce((acc, [key, value]) => {
  if (key === "carbs") acc[key] = value.split(",").filter(e => e);

  else acc[key] = value.includes(",") ? value.split(",") : value;

  return acc;
}, {});

console.log(result);