JavaScript JSON Key一覧取得

JavaScriptのJSONには型の概念が無いので引数に渡されたJSONが正しいかなどをキーの有無で判断することが必要な場合があります。JSONはキー・バリューでデータを保持しています。そのJSON変数に特定のキーがあるのかを判断するには、Object.keys()を使います。下記のJSONのキーの一覧を取得する場合

{
    "title": "装甲騎兵ボトムズ",
    "direction": "高橋良輔",
    "character": "キリコ・キュービィー"
}

上記のJSONがあったとして、このデータのキーとバリューを一気に表示するために下記のようなコードです。

const s1 = '{"title": "装甲騎兵ボトムズ","direction": "高橋良輔","character": "キリコ・キュービィー"}'
const j1 = JSON.parse(s1)
const keyList = Object.keys(j1)

for (let k1 in keyList){
    console.log(`key=${keyList[k1]} | value=${j1[keyList[k1]]} `)
}

Object.keys()を実行すると変数keyListに String[]が入ります。そのkeyListの中は[“0″,”1″,”2”]のようなデータが入ります。console.log()から吐き出されたデータは下になります。

Object.keys()はキー・バリュー構造以外のStringやArrayでも使えます。

const arrInt = [1,2,3]
const keyList = Object.keys(arrInt)
for (let k1 in keyList){
    console.log(`配列[${keyList[k1]}]=${arrInt[keyList[k1]]} `)
}

上記のarrInt(Number配列)にObject.keys(arrInt)したコードを実行すると下のようになります。

文字列も同じようにObject.keys()が使えます。

JSONデータが2階層以上ある場合下記のように書くこともできます。

const x1 = {
    "title": "装甲騎兵ボトムズ",
    "direction": "高橋良輔",
    "character": { 
        "main": "キリコ・キュービィー" , 
        "heroine": "フィアナ"
    }
}

const f1 = (_x1, _thNum) => {
    const keyList = Object.keys(_x1)
    for (let k1 in keyList){
        if (Object.prototype.toString.call(_x1[keyList[k1]])  != "[object Object]") {
            console.log(`layer[${_thNum}] | ${keyList[k1]} | ${_x1[keyList[k1]]} `)
        } else {
            f1(_x1[keyList[k1]], _thNum + 1)
        }
    }
}

f1(x1, 1)

結果は下のようになります。