如何访问嵌套数组的值？

Question

我在一个对象数组中有一个数组,我想从中检索一个属性.我在这里完成了它,但看起来很笨重.是否有更好的方法循环StaffList每个房间内的每个阵列？

window.onload = getInitials;
var data = {
    "room" : [
        {
            "id" : 1,
            "StaffList": [
                {                  
                  "inroom": true,                  
                  "initials": "MG"
                },
                {
                  "inroom": false,
                  "initials": "CT"
                },
                {
                  "inroom": true,
                  "initials": "MS"
                }
            ]
        },
        {
            "id" : 2,
            "StaffList": [
                {                  
                  "inroom": true,                  
                  "initials": "MG"
                },
                {
                  "inroom": false,
                  "initials": "CT"
                },
                {
                  "inroom": true,
                  "initials": "MS"
                },
                {
                  "inroom": true,
                  "initials": "MA"
                }
            ]
        }   

    ]
}

function getInitials() {
    var len = data.room.length;
    for(i = 0; i < len; i++) {
        var staffArray = data.room[i].StaffList;
        var room = data.room[i].id;
        if( staffArray != null ) {
            var allStaff = staffArray.filter(function(person) {
                if ( person.initials ) {
                    var inits = person.initials;
                    setInitials(room, inits);
                }
            });
        }
    }
}

function setInitials(room, initials) {
    //get element by ID
    //var staffContainer = $('#div' + room);
    var staffContainer = document.getElementById('div' + room);
    if(staffContainer != null) {
        //create new div to append
        var newDiv = document.createElement('div');
        newDiv.innerHTML = initials; 
        //append newly created <div>
        staffContainer.append(newDiv);
    }
}

Answer 1

你可以使用一些forEach:

data.room.forEach(function(room) {
  room.StaffList.forEach(function(person) {
    setInitials(room.id, person.initials);
  });
});

在这里,我们通过每个第一环room,然后通过各自person的StaffList.由于第二forEach是里面的第一个,我们有机会获得它的范围(通过关闭,请参阅如何JavaScript的关闭工作？).然后,我们就可以使用我们的新的参数,room并person为setInitials.

请注意没有使用var语句.当您不需要创建状态(变量)时,请不要这样做.较少的州通常也意味着更少的错误.但是,在您的setInitials函数中,容器和新的状态的使用div是要走的路.

PS:关于你的代码的其他事情让我感到困惑.您的变量room不是房间对象,而是id.这是误导!确保使用正确的名称.在这里,如果您希望状态存储房间的ID,请为其命名roomId.

你在评论中说,div如果inroom值为true ,你还想在创建的类上添加一个类(顺便说一下,你应该CamelCase它).在这种情况下,您可以将其作为第三个参数传递setInitials,然后根据函数体中的值添加该类.