JavaScript获取对象键名称


72

我如何获得后续的关键字名称?例如,我要“ 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()尽管这没有用。


7
如果您的键名实际上是button1button2依此类推,则可能需要创建buttons一个数组
Zirak 2012年

Answers:


90

如果您稍微修改一下措词,可能会更好地理解:

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 ] )以下内容:

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

还要注意,对象的属性顺序不是恒定的,并且可以更改,这与数组的索引顺序不同。这可能会派上用场。


你怎么会得到foo?
Demodave

2
@Demodave要获取foo属性的值,只需将其从buttons对象处调用即可buttons.foo===buttons['foo']。在for循环中,您可以调用buttons[property]。今天,您还可以使用Array.entries({foo:"bar",fizz:"buzz"})输出[['foo':'bar'],['fizz','buzz']]
桑普森

57

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

所以

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

1
这将所有键作为数组提供。如何获取特定密钥的密钥名称?
Shajeel Afzal,

1
我想这一点:Object.keys({myObj.fieldName})[0];
Shajeel Afzal,



3

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

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

输出将是部分


2

假设您有权访问原型,则可以使用。几分钟前,我为自己编写了这段代码;我一次只需要一个键,因此这对于大量的key:value对列表或吐出多个键名不是很省时。

function key(int) {
    var j = -1;
    for(var i in this) {
        j++;
        if(j==int) {
            return i;
        } else {
            continue;
        }
    }
}
Object.prototype.key = key;

该编号的工作方式与阵列相同,可避免麻烦。对于您的代码:

buttons.key(0) // Should result in "button1"

编辑原型几乎总是一个坏主意。
山姆

1

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)

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.