【JavaScript】配列/オブジェクトの形とデータ取得の方法

Javascript

毎度、配列/オブジェクトを扱う時にだいたい忘れて検索することになるので覚えるためのメモ。取得方法は他にもありますがとりあえず1方法だけ記載しています。

その1

var array01 = ['foo', 'bar'];

//単体取得
console.log(array01[1]);
//結果:bar

//全体取得
for (var i = 0; i < array01.length; i ++) {
    console.log(array01[i]);
}
//結果:foo bar

//指定の値があるかどうか、ある場合は0以上の順番を取得。ない場合は-1。
console.log(array01.indexOf("foo"));
//結果:0

その2

var array02 = [
        ['hoge', 'hogehoge'],
        ['fuga', 'fugafuga']
    ];
    
//単体取得
console.log(array02[0]);
//結果:['hoge','hogehoge']
console.log(array02[0][0]);
//結果:hoge
console.log(array02[0][1])
//結果:hogehoge

//全体取得
Object.keys(array02).forEach(function (key) {
    console.log(array02[key]);
});
//結果:[ "hoge", "hogehoge" ][ "fuga", "fugafuga" ]

//fugaの値がある配列の2番目の要素を取得
for(var key of Object.keys(array02)){
    if(array02[key][0] === "fuga"){
        console.log(array02[key][1]);
    }
}
//結果:fugafuga

その3

var array03 = {
    bar: "barbar",
    baz: "bazbaz"
};

//単体取得
console.log(array03.bar);//プロパティ名がbarのものの値
//結果:barbar

//値がbarbarのもののプロパティ名
var result = "";
var keys = Object.keys(array03);
for (var i = 0; i < keys.length; i++) {
    if (array03[keys[i]] === 'barbar') {
        result = keys[i];
    }
}
console.log(result);
//結果:bar

//全体取得(値)
Object.keys(array03).forEach(function (key) {
    console.log(array03[key]);
});
//結果:barbar bazbaz

//全体取得(プロパティ名)
Object.keys(array03).forEach(function (key) {
    console.log(key);
});
//結果:bar baz

//プロパティ名barで検索してその値を表示
for(var key of Object.keys(array03)){
    if(key == "bar"){
        console.log(array03[key]);
    }
}
//結果:barbar

//値bazbazで検索してそのプロパティ名を表示
for(var i = 0; i < Object.keys(array03).length;i++){
    if(array03[Object.keys(array03)[i]] == "bazbaz"){
        console.log(Object.keys(array03)[i]);
    }
}
//結果:baz

その4

var array04 = [
    {
        "name": "Tanaka",
        "age": 49,
        "languages": ["Japanese", "English"],
        "active": false
    },
    {
        "name": "Endo",
        "age": 50,
        "languages": ["Japanese", "English"],
        "active": true
    }
]

//単体取得(1つめのデータのlanguagesの2つめを取得)
console.log(array04[0].languages[1]);
//結果:English

//nameのみ全部取得
for(var i = 0; i < array04.length; i++){
    console.log(array04[i].name);
}
//結果:Tanaka Endo

//nameがEndoのオブジェクトを取得
var result = "";
for(var i = 0; i < array04.length; i++){
    if(array04[i].name === "Endo"){
        result = array04[i];
    }
}
console.log(result);
//結果:{"name": "Endo","age": 50,"languages": ["Japanese", "English"],"active": true}

その5

var array05 = {
    "id": "datalist",
    "data":[
        {
            "id" : 1, 
            "code" : 1,
            "data_name" : "test",
            "address" : "mailaddress11@mail.com",
            "tel" : "111-1111-0000"
        },
        {
            "id" : 2, 
            "code" : 2,
            "data_name" : "test2",
            "address" : "mailaddress22@mail.com",
            "tel" : "222-2222-2222"
        }
    ]
}

//dataの中の1つめのデータのaddressを取得
console.log(array05["data"][0]["address"]);
//結果:mailaddress11@mail.com

//dataのみ全体取得してオブジェクトへ
var result = [];
for(var i = 0; i < array05["data"].length; i++){
    result.push(array05["data"][i]);
}
console.log(result);
//結果:{ id: 1, code: 1, data_name: "test", … }...以下略

//telが222-2222-2222のオブジェクトを取得
//複数ある場合は1つ上のようにオブジェクトに追加していく
var result = "";
for(var i = 0; i < array05["data"].length; i++){
    if(array05["data"][i].tel === "222-2222-2222"){
        result = array05["data"][i];
    }
}
console.log(result);
//結果:{ id: 2, code: 2, data_name: "test2", address: "mailaddress22@mail.com", tel: "222-2222-2222" }

これで配列/オブジェクトもこわくないはず!

コメント

タイトルとURLをコピーしました