javascript-无法向基于开关大小写的数组添加新数据

我在基于switch case语句向特定数组插槽添加多个值时遇到一些问题。我可以从HTML下拉菜单中检索数据，我可以区分所选元素，但我无法在同一个插槽中添加累积数据。每个新值都会覆盖以前的数据，而不是将其添加

以下是JS代码：

function addData(category,cost)
        {
            var costsArr = [0,0,0,0];
            var cat = category.options[category.selectedIndex].text;
            var cos = parseInt(cost);
            console.log("category: "+cat+"; cost: "+ cos);

            switch(cat)
            {
                case "food":
                {
                    costsArr[0]+=cos;
                    console.log("cost in [0]: " +costsArr[0]);
                    console.log("food was selected");
                    break;
                }
                case "house holds":
                {
                    costsArr[1]+=cos;
                    console.log("cost in [1]: " +costsArr[1]);
                    break;
                }
                case "clothes":
                {
                    costsArr[2]+=cos;
                    console.log("cost in [2]: " +costsArr[2]);
                    break;
                }
                default:
                {
                    //something..
                }
            }
        }

HTML代码：

<form name="inputForm">
     enter cost here<input type="text" id="costText">

     <select name="catDropMenu" id="catMenu">
         <option value="title" id="title">-- Choose category --</option>
         <option value="food" id="food">food</option>
         <option value="clothes" id="clothes">clothes</option>
         <option value="house" id="house">house holds</option>
         <option value="new" id="newCatID">New category</option>
     </select>

     <input type="button" name="addButton" value="Add" onclick="addData(document.getElementById('catMenu'),document.getElementById('costText').value)">

</form>

在这里输入成本
--选择类别--
食物
衣服
众议院
新类别

更改此选项

function addData(category,cost)
{
    var costsArr = [0,0,0,0];
    // body

对此

var costsArr = [0,0,0,0];
function addData(category,cost)
{
    // body

使costsArr在全局范围内，这样它就不会在每次调用addData时重置。当前写入的方式将在调用addData时将每个值重置为零，因为调用函数时会定义costsArr。如果在函数中定义了costs数组，那么一旦函数结束，costs数组将从内存中删除

让我解释一下

对象（或javascript中的大多数变量，包括您的成本数组）存储在内存中，它们对应的变量只保存相应对象所在的内存位置

当变量不再知道对象时，称为垃圾收集器的东西会从内存中删除对象

因此考虑函数的寿命。一旦完成，如果没有其他函数在它的作用域中运行，可以访问它定义的变量，那么所有的内存现在都是不可访问的。所以垃圾收集器会删除它。因此，costsArr被删除

---

因此，要避免这种情况，您需要在函数外部创建一个全局变量，为该函数创建持久数据。

谢谢！它起作用了！但是，除了将数组定义为全局数组之外，还有没有一种更优雅或正确的方法来定义它呢？据我所知，我不知道，我将编辑响应来解释