blocks|key|874787|text|如果要获取所有密钥，请使用ECMAScript+5+introduced+Object.keys。这只被较新的浏览器支持，但是MDC+documentation提供了另一种实现(也使用for...in+btw)：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|874788|if(!Object.keys)+Object.keys+=+function(o){
+++++if+(o+!==+Object(o))
++++++++++throw+new+TypeError('Object.keys+called+on+non-object');
+++++var+ret=[],p;
+++++for(p+in+o)+if(Object.prototype.hasOwnProperty.call(o,p))+ret.push(p);
+++++return+ret;
}|code-block|syntax|javascript|874789|当然，如果同时需要键和值，那么for...in是唯一合理的解决方案。|874790|entityMap|0|LINK|mutability|MUTABLE|url|http://ecma262-5.com/ELS5_HTML.htm#Section_15.2.3.14|1|https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/keys^0|11|B|2K|8|D|Z|0|1R|H|1|0|0|F|8|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]|$9|Z|A|10|B|C]]|D|@$9|11|A|12|1|13]|$9|14|A|15|1|16]]|E|$]]|$1|F|3|G|5|H|7|17|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|18|8|@$9|19|A|1A|B|C]]|D|@]|E|$]]|$1|M|3|-4|5|6|7|1B|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]|U|$5|P|Q|R|E|$S|V]]]]

If you want to get all keys, <a href="http://ecma262-5.com/ELS5_HTML.htm#Section_15.2.3.14" rel="noreferrer">ECMAScript 5 introduced <code>Object.keys</code></a>. This is only supported by newer browsers but the <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/keys" rel="noreferrer">MDC documentation</a> provides an alternative implementation (which also uses <code>for...in</code> btw):

<pre><code>if(!Object.keys) Object.keys = function(o){
 if (o !== Object(o))
 throw new TypeError('Object.keys called on non-object');
 var ret=[],p;
 for(p in o) if(Object.prototype.hasOwnProperty.call(o,p)) ret.push(p);
 return ret;
}
</code></pre>

Of course if you want both, key and value, then <code>for...in</code> is the only reasonable solution.

blocks|key|657665|text|您可以使用for循环在对象内部进行迭代：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|657666|for(var+i+in+foo){
++alert(i);+//+alerts+key
++alert(foo[i]);+//alerts+key's+value
}|code-block|syntax|javascript|657667|或|657668|Object.keys(foo)
++.forEach(function+eachKey(key)+{+
++++alert(key);+//+alerts+key+
++++alert(foo[key]);+//+alerts+value
++});|657669|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

You would iterate inside the object with a for loop:

<pre><code>for(var i in foo){
 alert(i); // alerts key
 alert(foo[i]); //alerts key's value
}
</code></pre>

Or

<pre><code>Object.keys(foo)
 .forEach(function eachKey(key) { 
 alert(key); // alerts key 
 alert(foo[key]); // alerts value
 });
</code></pre>

blocks|key|874936|text|您可以单独访问每个键，而无需迭代，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|874937|var+obj+=+{+first:+'someVal',+second:+'otherVal'+};
alert(Object.keys(obj)[0]);+//+returns+first
alert(Object.keys(obj)[1]);+//+returns+second|code-block|syntax|javascript|874938|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

You can access each key individually without iterating as in:

<pre><code>var obj = { first: 'someVal', second: 'otherVal' };
alert(Object.keys(obj)[0]); // returns first
alert(Object.keys(obj)[1]); // returns second
</code></pre>

blocks|key|875076|text|给定您的对象：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|875077|var+foo+=+{+'bar'+:+'baz'+}|code-block|syntax|javascript|875078|要获取bar，请使用：|offset|length|style|CODE|875079|Object.keys(foo)[0]|875080|要获取baz，请使用：|875081|foo[Object.keys(foo)[0]]|875082|假设只有一个对象|875083|entityMap^0|0|0|3|3|0|0|3|3|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Y|8|@$I|Z|J|10|K|L]]|9|@]|A|$]]|$1|M|3|N|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|O|3|P|5|6|7|12|8|@$I|13|J|14|K|L]]|9|@]|A|$]]|$1|Q|3|R|5|D|7|15|8|@]|9|@]|A|$E|F]]|$1|S|3|T|5|6|7|16|8|@]|9|@]|A|$]]|$1|U|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|V|$]]

Given your Object:

<pre><code>var foo = { 'bar' : 'baz' }
</code></pre>

To get <code>bar</code>, use:

<pre><code>Object.keys(foo)[0]
</code></pre>

To get <code>baz</code>, use:

<pre><code>foo[Object.keys(foo)[0]]
</code></pre>

Assuming a single object

blocks|key|657957|text|这是最简单和容易的方法。这就是我们要做的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|657958|​|657959|var+obj+=+{+'bar'+:+'baz'+}
var+key+=+Object.keys(obj)[0];
var+value+=+obj[key];
+++++
+console.log("key+=+",+key)+//+bar
+console.log("value+=+",+value)+//+baz|code-block|syntax|javascript|657960|Object.keys()是javascript方法，当在对象上使用时，它返回一个键数组。|657961|657962|Object.keys(obj)+//+['bar']|657963|现在，您可以迭代对象并访问如下所示的值：|657964|Object.keys(obj).forEach(+function(key)+{
++console.log(obj[key])+//+baz
})|657965|entityMap^0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|U|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|V|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|W|8|@]|9|@]|A|$]]|$1|K|3|C|5|6|7|X|8|@]|9|@]|A|$]]|$1|L|3|M|5|F|7|Y|8|@]|9|@]|A|$G|H]]|$1|N|3|O|5|6|7|Z|8|@]|9|@]|A|$]]|$1|P|3|Q|5|F|7|10|8|@]|9|@]|A|$G|H]]|$1|R|3|-4|5|6|7|11|8|@]|9|@]|A|$]]]|S|$]]

This is the simplest and easy way. This is how we do this.

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var obj = { 'bar' : 'baz' }
var key = Object.keys(obj)[0];
var value = obj[key];
 
 console.log("key = ", key) // bar
 console.log("value = ", value) // baz</code></pre>
</div>
</div>

 Object.keys() is javascript method which return an array of keys when using on objects.

<pre><code>Object.keys(obj) // ['bar']
</code></pre>

Now you can iterate on the objects and can access values like below-

<pre><code>Object.keys(obj).forEach( function(key) {
 console.log(obj[key]) // baz
})
</code></pre>

blocks|key|875158|text|//+iterate+through+key-value+gracefully
const+obj+=+{+a:+5,+b:+7,+c:+9+};
for+(const+[key,+value]+of+Object.entries(obj))+{
++console.log(`${key}+${value}`);+//+"a+5",+"b+7",+"c+9"
}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|875159|参考MDN|unstyled|875160|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>// iterate through key-value gracefully
const obj = { a: 5, b: 7, c: 9 };
for (const [key, value] of Object.entries(obj)) {
 console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
}
</code></pre>

Refer MDN

blocks|key|874999|text|我也遇到了同样的问题，这就是解决问题的办法|type|unstyled|depth|inlineStyleRanges|entityRanges|data|875000|//example+of+an+Object
var+person+=+{
++++firstName:"John",
++++lastName:"Doe",
++++age:50,
++++eyeColor:"blue"
};

//How+to+access+a+single+key+or+value
var+key+=+Object.keys(person)[0];
var+value+=+person[key];|code-block|syntax|javascript|875001|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I was having the same problem and this is what worked
<pre><code>//example of an Object
var person = {
 firstName:&quot;John&quot;,
 lastName:&quot;Doe&quot;,
 age:50,
 eyeColor:&quot;blue&quot;
};

//How to access a single key or value
var key = Object.keys(person)[0];
var value = person[key];
</code></pre>

blocks|key|875304|text|获取对象键/值的最佳方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|875305|​|875306|let+obj+=+{
++++++++'key1':+'value1',
++++++++'key2':+'value2',
++++++++'key3':+'value3',
++++++++'key4':+'value4'
++++}
++++Object.keys(obj).map(function(k){+
++++console.log("key+with+value:+"%2Bk+%2B"+=+"%2Bobj[k])++++
++++
++++})|code-block|syntax|javascript|875307|875308|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|N|8|@]|9|@]|A|$G|H]]|$1|I|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|J|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|K|$]]

best way to get key/value of object.

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>let obj = {
 'key1': 'value1',
 'key2': 'value2',
 'key3': 'value3',
 'key4': 'value4'
 }
 Object.keys(obj).map(function(k){ 
 console.log("key with value: "+k +" = "+obj[k]) 
 
 })
 </code></pre>
</div>
</div>

blocks|key|657474|text|除了for+(var+key+in+foo)我什么也没看到。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|657475|entityMap^0|2|K|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

I don't see anything else than <code>for (var key in foo)</code>.

blocks|key|657617|text|既然您提到了$.each()，下面是一个可以在jQuery+1.6%2B中使用的方便方法：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|657618|var+foo+=+{+key1:+'bar',+key2:+'baz'+};

//+keys+will+be:+['key1',+'key2']
var+keys+=+$.map(foo,+function(item,+key)+{
++return+key;
});|code-block|syntax|javascript|657619|entityMap^0|6|8|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

Since you mentioned <code>$.each()</code>, here's a handy approach that would work in jQuery 1.6+:

<pre><code>var foo = { key1: 'bar', key2: 'baz' };

// keys will be: ['key1', 'key2']
var keys = $.map(foo, function(item, key) {
 return key;
});
</code></pre>

blocks|key|874714|text|除了for+...+in，别无他法。如果您不想使用它(也许是因为必须在每次迭代中测试hasOwnProperty的效率都比较低？)然后使用不同的结构，例如kvp数组：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|874715|[{+key:+'key',+value:+'value'},+...]|code-block|syntax|javascript|874716|entityMap^0|2|A|16|E|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

There is no way other than <code>for ... in</code>. If you don't want to use that (parhaps because it's marginally inefficient to have to test <code>hasOwnProperty</code> on each iteration?) then use a different construct, e.g. an array of kvp's:

<pre><code>[{ key: 'key', value: 'value'}, ...]
</code></pre>

blocks|key|874652|text|$.each是一个库构造，而for+...+in是原生js，这应该更好。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|874653|entityMap^0|0|6|E|A|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]|$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|M|8|@]|D|@]|E|$]]]|G|$]]

Well <code>$.each</code> is a library construct, whereas <code>for ... in</code> is native js, which should be better

blocks|key|658004|text|您可以使用Object.keys功能获取密钥，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|658005|const+tempObjects={foo:"bar"}

Object.keys(tempObjects).forEach(obj=>{
+++console.log("Key->"%2Bobj%2B+"value->"%2BtempObjects[obj]);
});|code-block|syntax|javascript|658006|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

You can use Object.keys functionality to get the keys like:

<pre class="lang-js prettyprint-override"><code>const tempObjects={foo:"bar"}

Object.keys(tempObjects).forEach(obj=&gt;{
 console.log("Key-&gt;"+obj+ "value-&gt;"+tempObjects[obj]);
});
</code></pre>

blocks|key|875123|text|要显示为字符串，只需使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|875124|console.log("they+are:+"+%2B+JSON.stringify(foo));|code-block|syntax|javascript|875125|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

for showing as a string, simply use:

<pre><code>console.log("they are: " + JSON.stringify(foo));
</code></pre>

If I have a JS object like:

<pre><code>var foo = { 'bar' : 'baz' }
</code></pre>

If I know that <code>foo</code> has that basic key/value structure, but don't know the name of the key, what's the easiest way to get it? <code>for ... in</code>? <code>$.each()</code>? I hope there's something better....

best way to get the key of a key/value javascript object

jQuery

JSON

如果我有一个JS对象，比如：var foo = { 'bar' : 'baz' }如果我知道foo具有基本键/值结构，但不知道键的名称，那么获取它最简单的方法是什么？for ... in？$.each()？我希望有更好的.

问获取键/值javascript对象键的最佳方法
EN

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问获取键/值javascript对象键的最佳方法EN

回答 14

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问获取键/值javascript对象键的最佳方法
EN