キー/値のJavaScriptオブジェクトのキーを取得する最良の方法


186

私のようなJSオブジェクトがある場合:

var foo = { 'bar' : 'baz' }

私はそれがわかっている場合はfoo、その基本的なキー/値の構造を持っていますが、キーの名前がわからない、それを得るための最も簡単な方法は何ですか?for ... in$.each()?もっと良いものがあるといいのですが...


5
...の何が問題になっていますか?
Matt

1
それは間接的に感じられ、hasOwnPropertyを使用する必要があります。私はそれをしないライブラリ機能....作りますね
sprugman

回答:


93

すべてのキーを取得したい場合は、ECMAScript 5が導入されましたObject.keys。これは新しいブラウザでのみサポートされていますが、MDCのドキュメントでは代替の実装が提供されています(for...inbtw も使用しています)。

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;
}

もちろん、キーと値の両方が必要な場合は、それfor...inが唯一の合理的なソリューションです。


pキーを取得しますが、キーの値を取得するにはどうすればよいですか?ありがとう。
Si8

1
キーと値の両方に、新しいObject.entries()developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…を
Kzqai

多分それは私の限られた理解のしるしですが、この答えは、キー/値を取得するだけの単純なものでは信じられないほど冗長(確かに再利用可能)のようです。@Michael Beninの回答を最高の回答としてマークしないでください。
アーロンマシューズ

7
えっと…最初のリンクをクリックした他の誰かが匿名の麻薬にリダイレクトされますか?
John Duskin

193

オブジェクト内でforループを繰り返します。

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

または

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

私になりたくない場合はどうなりfoo[i]ます"_proto_"か?
user2284570


もし私がalert()したくないfoo[i]場合isome stringどうなりますか?
user2284570 2016年

@ user2284570:私は文字列にすることができます-問題ありません。
ゲルフリート

for(var i in Object.keys(foo)){
サムライジャック

103

次のように繰り返すことなく、各キーに個別にアクセスできます。

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

3
あなたは今、それが良く見える、この目的のために拡散演算子を使用することができます const [firstKey, ...rest] = Object.keys(obj);
Nerlin

65

あなたのオブジェクトを考える:

var foo = { 'bar' : 'baz' }

を取得するにはbar、次を使用します:

Object.keys(foo)[0]

を取得するにはbaz、次を使用します:

foo[Object.keys(foo)[0]]

単一のオブジェクトを想定


27

あなたのためのワンライナー

const OBJECT = {
    'key1': 'value1',
    'key2': 'value2',
    'key3': 'value3',
    'key4': 'value4'
};

const value = 'value2';

const key = Object.keys(OBJECT)[Object.values(OBJECT).indexOf(value)];

window.console.log(key); // = key2

26

これが最も簡単で簡単な方法です。これが私たちのやり方です。

var obj = { 'bar' : 'baz' }
var key = Object.keys(obj)[0];
var value = obj[key];
     
 console.log("key = ", key) // bar
 console.log("value = ", value) // baz
Object.keys()は、オブジェクトで使用するときにキーの配列を返すJavaScriptメソッドです。

Object.keys(obj) // ['bar']

これで、オブジェクトを反復して、以下のような値にアクセスできます-

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

TypeErrorキーが数字であることを期待するなら、あなたは得るかもしれません。キーは常に文字列だからです。

15

私は同じ問題を抱えていましたが、これはうまくいきました

//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.firstName;

11
なんでvar value = person[key];?そうすれば、プルする値のキーを知る必要はありません。
Sean Kendle 2016

14
// 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"
}

MDNを参照



5

最も簡単な方法は、Underscore.jsを使用することです。

キー

_.keys(object)オブジェクトのプロパティのすべての名前を取得します。

_.keys({1:1、2:2、3:3}); => ["1"、 "2"、 "3"]

はい、追加のライブラリが必要ですが、とても簡単です!


4
@lonesomedayはい、ただしアンダースコア/ロダッシュは他の多くの点でも役立ちますので、取り上げる価値はあります。
jcollum

4

以外に方法はありませんfor ... in。それを使用したくない場合(hasOwnPropertyおそらく、各反復でテストする必要があるために効率がわずかに悪いためでしょうか?)異なる構成、たとえばkvpの配列を使用します。

[{ key: 'key', value: 'value'}, ...]

4

あなたが言及したので$.each()、jQuery 1.6 以降で機能する便利な方法を次に示します。

var foo = { key1: 'bar', key2: 'baz' };

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

4

Object.keys() Object.keys()メソッドは、指定されたオブジェクト自体の列挙可能なプロパティの配列を、for ... inループで提供されるのと同じ順序で返します(違いは、for-inループがプロパティを列挙することです)プロトタイプチェーンでも同様です)。

var arr1 = Object.keys(obj);

Object.values() Object.values()メソッドは、指定されたオブジェクト自体の列挙可能なプロパティ値の配列を、for ... inループによって提供されるのと同じ順序で返します(違いは、for-inループが列挙することです)プロトタイプチェーンのプロパティも同様です)。

var arr2 = Object.values(obj);

詳しくはこちらへ


3

JavaScriptでオブジェクトまたはマップのキーにアクセスするための各ループに使用

for(key in foo){
   console.log(key);//for key name in your case it will be bar
   console.log(foo[key]);// for key value in your case it will be baz
}

注:使用することもできます

Object.keys(foo);

次のような出力が得られます。

[バー];



1

Object.keys機能を使用して、次のようなキーを取得できます。

const tempObjects={foo:"bar"}

Object.keys(tempObjects).forEach(obj=>{
   console.log("Key->"+obj+ "value->"+tempObjects[obj]);
});


0

オブジェクトのキー/値を取得する最良の方法。

let obj = {
        'key1': 'value1',
        'key2': 'value2',
        'key3': 'value3',
        'key4': 'value4'
    }
    Object.keys(obj).map(function(k){ 
    console.log("key with value: "+k +" = "+obj[k])    
    
    })
    

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.