【Javascript】 連想配列 – プログラミング入門

連想配列は、配列を拡張したものという感覚で使えます。配列は[5]のように、数値でインデックスを指定しましたが、連想配列では数値以外も使えます。

使い方

連想配列は、このように利用します。

let a = {foo: 10, bar: 20, 1: 30};
console.log(a.foo);
console.log(a["bar"]);
console.log(a[1]);
10
20
30

連想配列は、”Key”と”Value”が重要なキーワードです。Valueはそのままの意味ですが、Keyは、Valueを取り出すために使用します。

このように、列が2つのテーブルを作っていると考えると分かりやすくなると思います。Keyで完全一致検索をし、検索結果がValueです。

KeyValue
foo10
bar20
130

要素は波括弧で囲い、波括弧の中にKey: Valueの形式で書きます。それぞれ、カンマで区切ります。Keyは数値か文字列(クォーテーション不要)などが利用できます。

連想配列作成時に変数の値をキーにしたい場合、{ [var]: value }のように書くと可能です。

また、特殊な文字を含む文字列をキーにしたい場合、{ "hoge(hige)": value }のように、クォーテーションで囲むなどすればよいです。

配列は順番がありましたが、Javascriptの連想配列には順番がありません。

順序が必要なときは配列を利用するか、別途順序の情報を保持しておく必要があります。

連想配列の要素を利用するには、2種類の書き方があります。

配列と同じようにx[key]の形式

例えば、このような利用が挙げられます。

function getHttpStatus() {
    // TODO: 実際のHTTPステータスに応じるようにする
    return 400;
}

let errorMessage = {
    200: "OK",
    400: "Bad Request",
    404: "Not Found",
    500: "Internal Server Error",
};

let a = getHttpStatus();
console.log(errorMessage[a]);
Bad Request

最後の要素はカンマがあってもなくてもどちらでも大丈夫です。最後の要素のあとのカンマをケツカンマと呼び、付けるか付けないかで意見が別れています。

x.keyの形式

この書き方は、他の言語でインスタンスのメソッドを呼び出すときなどに利用する書き方ですね。

let a = {foo: 10, bar: 20, 1: 30};
console.log(a.foo);
10

この場合、文字列がキーでもクォーテーションは不要です。しかし、数値で始まる場合、文字列中にドットなど一部の文字を含むなどがある場合は利用できません。

多次元な連想配列

多次元配列と同様の感覚で書くことができます。

let x = {
    a: {
        aa: 100,
        ab: 200,
        ac: 300,
    },
    b: {
        ba: 500,
        bb: 600,
    }
};
console.log(x["a"]["ab"]);
console.log(x["b"]);
200
{ba: 500, bb: 600}

もちろん、配列の中に連想配列を入れることもできますし、連想配列の中に配列を入れることもできます。

連想配列の操作

要素の追加

連想配列に要素を追加する場合、適当に追加したいキーを指定して代入するだけです。つまり、存在しないキーを指定して代入すると、自動的にそのキーが連想配列に追加されます。

let a = {foo: 10, bar: 20, 1: 30};
a["hoge"] = 40;
a.fuga = 50;
console.log(a);
{ '1': 30, foo: 10, bar: 20, hoge: 40, fuga: 50 }

追加されています。エラーや警告が出るわけでもないので、typoには十分注意しましょう。

要素の削除

削除はdeleteで削除します。あまり利用しません。

let a = {foo: 10, bar: 20, 1: 30};
delete a.foo;
delete a[1];
console.log(a);
{ bar: 20 }

まとめ

連想配列は、テーブルのようにKeyとValueのペアを保存します。Valueを取り出すにはx[key]x.keyのようにKeyを指定します。

連想配列と配列はどちらもよく使います。配列と連想配列の特徴を実際に使いながら理解して、適切に使い分けられるようになりましょう!

dict thumb

役に立ったらシェアしよう!