Web開発など

Java, JS, CSS, HTML, Unity, C# のことなどを書いてます。フリーソフトの公開もしています。

JSON：ハイフンが含まれるキーにアクセス

JS/CSS/HTML

ハイフンがある JSONのキーにアクセスして、値を取り出す方法を書いていきます。

方法

角括弧を使って、下のようにアクセスします。

変数名["キー"]

例えば、

let msg = { "msg-id":1 };
let msgId = msg["msg-id"];

といった感じです。

エラー例

ピリオドを使ってアクセスするとエラーになります。

let msg = { "msg-id":1 };
let msgId = msg.msg-id; // エラー

HTMLのコード例

変数 msg に JSONを格納して、値を出力する例です。

index.html

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>JSONテスト</title>
  <script>
    let msg = { "msg-id":1 };

    // NG
    //console.log(msg.msg-id);

    // OK
    console.log(msg["msg-id"]);
  </script>
</head>
<body></body>
</html>

NG のコードを実行すると、以下のエラーが出力されました。

Uncaught ReferenceError: id is not defined
    at index.html:10:25