JavaScript如何不手动输入key名获取对象中数组属性的key名及对应值

实现方案 #

你可以根据实际需求选择以下任意一种方式： #

方式1：仅避免硬编码size字符串，确定要输出该属性

提前把属性名定义为变量，后续全量引用变量即可，需要修改属性名时只需改一处定义：

const targetKey = 'size'
for(let i=0; i<elements.length;i++)
{
    console.log("***" + elements[i].name + "***");
    console.log(`${targetKey}:${elements[i][targetKey]}`);
}

方式2：动态识别对象中的数组类型属性，无需提前知道属性名

如果你的需求是找到对象中值为数组的属性（当前示例里仅size符合该特征），自动输出它的键名和值，可以结合Object.entries()遍历筛选：

for(let i=0; i<elements.length;i++)
{
    console.log("***" + elements[i].name + "***");
    for (const [key, value] of Object.entries(elements[i])) {
        if (Array.isArray(value)) {
            console.log(`${key}:${value}`);
            // 确定只有一个数组属性的话，找到后可以直接跳出循环优化性能
            break
        }
    }
}

方式3：输出对象所有属性的键值对，无需手动指定任何key

如果需要打印当前对象除name外的全部属性，直接全量遍历即可：

for(let i=0; i<elements.length;i++)
{
    console.log("***" + elements[i].name + "***");
    for (const [key, value] of Object.entries(elements[i])) {
        // 跳过已经单独输出的name属性，不需要可以删除这行
        if (key === 'name') continue
        console.log(`${key}:${value}`);
    }
}

内容的提问来源于stack exchange，提问作者Tenzo