在jquery中为多维数组分配索引和值

Question

我想在jquery中为多维数组添加特定的(数字)索引，然后在这些索引处赋值。每个索引本身将是一个数组，并且这些子数组的索引也将被动态分配。

$(document).ready(function(){
    $('#Show').click(function(){ 
        var AllItem = new Array();                             
        $("select[name^='Item']").each(function(dropdownumber, selected) {
            var name = $(this).attr('name');
            var toRemove = 'Item[';
            var name1 = name.replace(toRemove,'');
            var CategoryCode = name1.replace(']','');
            alert('item category code = ' + CategoryCode);
            if (!AllItem[CategoryCode]){ 
                //here I want that index 9 is set as an array, but it adds 9 elements , 
                //I need that only one index is added i.e. 9 and its value is array
                AllItem[CategoryCode] = [];
                alert('added='+CategoryCode);
            }
            //length comes out to be 10 
            //but it should be 1 as I have added only one index i.e. 9 & its an array   
            alert('length='+AllItem.length);
            //after this I need to assign values at 9th index of the array like
            // AllItem[9][0] = 2; //the value of the first index of 9th index is 2
            // AllItem[9][1] = 5;
            // AllItem[9][2] = 6;
            // AllItem[9][3] = 9;

UPDATE:

//for adding values at indexes of AllItem  :  AllItem[9][1] = 5;
$(this).find(':selected').each(function(selectedoptionnumber, selected) {
    var SelectedVal = $(selected).val();
    if (SelectedVal > 0) {
        AllItem[CategoryCode][dropdownumber] = SelectedVal;
        alert(' Code = ' + AllItem[CategoryCode][dropdownumber]);
    }
});
<table style="border: 2px solid #97BDC9; border-collapse:collapse;">
    <tbody>
        <tr>
            <td>
                <select name="Item[9]">
                    <option selected="selected" value="0">-Select-</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>
                <input type="button" id="Show" value="Show Selected Items" />
            </td>
        </tr>
    </tbody>
</table>

Answer 1

这里我想把索引9设置为一个数组，但是它添加了9个元素，

我只需要添加一个索引即9它的值为array

实际上，它没有添加9个元素，只有1个。那一个元素位于索引8(假定不是9——记住索引从0开始);索引0-7 根本没有值。这是因为JavaScript标准数组本质上是稀疏的(并且根本不是真正的数组)。

长度为10

，但它应该是1，因为我只添加了一个索引，即9 &它是一个数组

length属性没有定义为数组中条目数的计数。它被定义为(至少)比最高数组索引大1。因为数组可以有缺失的条目，所以length可以大于(但不能小于)数组中的条目数。

现在，如果您不需要数组对象的数组性，您可以使用普通对象代替。唯一的区别是它没有length属性，也没有各种特定于数组的函数(forEach等)。为此，只需更改

var AllItem = new Array(); 

,

var AllItem = {};

您可以将[]符号与对象以及数组一起使用(因为数组只是对象，[]符号是对象的东西，而不是数组的东西)，因此您的其他代码不会更改

但是，唯一的区别是length属性和各种数组函数。

---

关于在索引8处添加一个表项不会在0-7处创建表项的更多信息:

当你这样做的时候:

var a = [];
a[8] = "value";

将条目8设置为该值，将a.length设置为9。不向数组中添加 else。

console.log(0 in a); // false
console.log(1 in a); // false
...
console.log(7 in a); // false
console.log(8 in a); // true!

人们有时很难理解这一点，但关键在于上面的链接文章:数组根本不是真正的数组，它们只是被添加了一点魔法的对象。数组"indexes"都是属性名和数组项都是属性。所以a[8] = "value"创建了一个属性"8"在a对象上。它不创建任何其他属性。

当你读取一个不存在的属性的值(在对象或它的原型上)，你会得到值undefined，但这并不意味着该属性存在，这只是JavaScript如何定义来处理这种情况(读取一个不存在的属性)。

in运算符(上面使用的)和hasOwnProperty函数允许您测试属性是否存在 (in查看对象及其原型，hasOwnProperty仅查看对象)。

---

关于你更新代码的问题，这一行可能是也可能不是一个问题，这取决于你有什么其他代码:

AllItem[CategoryCode][dropdownumber] = SelectedVal;

那很好如果你已经把一个对象或数组在AllItem[CategoryCode]。如果没有设置，则会导致错误。

如果你知道你已经这样做了，那么这行就没问题了。

如果你知道你没有那样做，那么:

AllItem[CategoryCode] = [];
AllItem[CategoryCode][dropdownumber] = SelectedVal;

如果你可能或可能没有这样做，那么:

if (!AllItem[CategoryCode]) {
    AllItem[CategoryCode] = [];
}
AllItem[CategoryCode][dropdownumber] = SelectedVal;

(或者有时你会看到:

)

(AllItem[CategoryCode] = AllItem[CategoryCode] || [])[dropdownumber] = SelectedVal;

但通常不需要这种东西，因为它很难阅读和调试)