Javascript获取对象密钥名称

Question

我如何获得以下关键名称？我想要"button1"和"button2"？

var buttons = {
    button1: {
        text: 'Close',
        onclick: function(){

        }
    },
    button2: {
        text: 'Close2',
        onclick: function(){

        }
    }
}

var i;
for(i in buttons){
    if(buttons.hasOwnProperty(i)){
        alert(buttons[i].text);
    }
} 

我尝试使用.push()虽然这没用.

Answer 1

如果您稍微修改了一些措辞,可能会更好地理解这一点:

var buttons = {
  foo: 'bar',
  fiz: 'buz'
};

for ( var property in buttons ) {
  console.log( property ); // Outputs: foo, fiz or fiz, foo
}

请注意,您将迭代对象的属性,property在每个后续周期中使用每个属性作为参考.

MSDN说到for ( variable in [object | array ] )以下内容:

在循环的每次迭代之前,为变量分配对象的下一个属性名称或数组的下一个元素索引.然后,您可以在循环内的任何语句中使用它来引用对象的属性或数组的元素.

另请注意,对象的属性顺序不是常量,并且可以更改,与数组的索引顺序不同.这可能会派上用场.

Answer 2

ECMAscript第5版还为您提供了简洁的方法Object.keys()和Object.getOwnPropertyNames().

所以

Object.keys( buttons );  // ['button1', 'button2'];

Answer 3

更改alert(buttons[i].text);到alert(i);

Answer 4

变量i是你看起来的关键名称。

Answer 5

这是一个简单的示例，它将帮助您获取对象键名称。

var obj ={parts:{costPart:1000, salesPart: 2000}}; console.log(Object.keys(obj));

输出将是parts。

Answer 6

ES6 更新...虽然过滤器和地图都可能需要自定义。

Object.entries(theObj) 返回一个对象的 [[key, value],] 数组表示，可以使用 Javascript 的数组方法，.each(), .any(), .forEach(), .filter(), .map(), .reduce() 等

节省大量迭代对象部分Object.keys(theObj)或Object.values()单独的工作。

const buttons = {
    button1: {
        text: 'Close',
        onclick: function(){

        }
    },
    button2: {
        text: 'OK',
        onclick: function(){

        }
    },
    button3: {
        text: 'Cancel',
        onclick: function(){

        }
    }
}

list = Object.entries(buttons)
    .filter(([key, value]) => `${key}`[value] !== 'undefined' ) //has options
    .map(([key, value], idx) => `{${idx} {${key}: ${value}}}`)
    
console.log(list)

Answer 7

要检索键和值，请使用以下命令。

 for (let property in buttons) {
    console.log('key:' + property, 'value:'+ buttons[property]);
 }