Object.keys() / values() / entries() 対応: ES5(ECMAScript 2009)
オブジェクトが持つキー名、値、またはキーと値のペアを配列として取得します。
構文
// オブジェクトのキー名の一覧を配列で取得します。 Object.keys(オブジェクト) // オブジェクトの値の一覧を配列で取得します。 Object.values(オブジェクト) // オブジェクトのキーと値のペアを配列で取得します。 Object.entries(オブジェクト)
メソッド一覧
| メソッド | 概要 |
|---|---|
| Object.keys(オブジェクト) | オブジェクトが持つ列挙可能なプロパティのキー名を文字列の配列として返します。 |
| Object.values(オブジェクト) | オブジェクトが持つ列挙可能なプロパティの値を配列として返します。 |
| Object.entries(オブジェクト) | オブジェクトが持つ列挙可能なプロパティの『[キー, 値]』ペアの配列を返します。 |
サンプルコード
var user = {
name: "Kuu",
age: 25,
city: "Tokyo"
};
// キー名の一覧を取得します。
console.log(Object.keys(user)); // 『["name", "age", "city"]』と出力されます。
// 値の一覧を取得します。
console.log(Object.values(user)); // 『["Kuu", 25, "Tokyo"]』と出力されます。
// キーと値のペアを取得します。
console.log(Object.entries(user)); // 『[["name", "Kuu"], ["age", 25], ["city", "Tokyo"]]』と出力されます。
// Object.keys で forEach を使ってループできます。
Object.keys(user).forEach(function(key) {
console.log(key + ": " + user[key]);
});
// Object.entries で分割代入を使ったループも可能です。
Object.entries(user).forEach(function([key, value]) {
console.log(key + " = " + value);
});
// プロパティの数を取得できます。
console.log(Object.keys(user).length); // 『3』と出力されます。
概要
『Object.keys()』『Object.values()』『Object.entries()』はオブジェクトのプロパティ情報を配列として取得するメソッドです。for...in ループと異なりプロトタイプチェーンのプロパティは含まれないため、オブジェクト自身のプロパティだけを安全に取得できます。
戻り値は配列のため、『forEach()』『map()』『filter()』などの配列メソッドと組み合わせて柔軟な処理が可能です。プロパティの数を調べるには Object.keys(obj).length が便利で、オブジェクトが空かどうかの判定にも使えます。
『Object.entries()』はfor...of ループや分割代入と組み合わせると、キーと値の両方を効率よく処理できます。逆にキーと値のペアの配列からオブジェクトを作り直したい場合は Object.fromEntries() を使用します。
対応ブラウザ
デスクトップ
4 以前 ×
3.5 以前 ×
4 以前 ×
8 以前 ×
11 以前 ×モバイル
Android Browser
37 以降 ○
4 以前 ×
Chrome Android
36 以降 ○
17 以前 ×
Firefox Android
79 以降 ○
3 以前 ×記事の間違いや著作権の侵害等ございましたらお手数ですがこちらまでご連絡頂ければ幸いです。