javaScript70_Array配列とmapオブジェクト

 MDNの中にArrayクラスについて下記のように説明しています。
-JavaScript の Array クラスはグローバルオブジェクトで、高水準、リスト風のオブジェクトである配列の構築に使用されます。
-簡単に言うとリストのようなオブジェクトです。
```ruby
// 配列を生成する従来の書き方
const fruits = new Array();
// シンタックスシュガー
const fruits = [];  
//例：
const fruits = ["りんご","バナナ"];
console.log(fruits);
// 値を追加、push() 
fruits.push("みかん"); 
console.log(fruits);
```
**シンタックスシュガー**：
プログラミング言語で、ある構文を別の記法で記述できるようにしたもの。 長い構文を簡略に記述できるようにしたり、複雑な構文を読み書きしやくするために用意される。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/34468f6e-e863-7fdd-bf83-3547c9c75efa.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/48dca43a-7cd1-4c8a-7436-e6d6e6bf7cdf.png)

２次元配列：
```ruby
const array = [
["黄","紫","赤"],
["緑","黒","青"]
];

console.log(array[0][1]);
    // 結果は紫
console.log(array[1][1]);
    // 結果は黒
```

連想配列：キーと値がセットになっています。他のプログラミング言語で辞書と呼ばれたりします。
```ruby
// オブジェクト
const profile = {
    'name':'山辺',
    'age': 30,
    'hobby': 'game'
};

console.log(profile.age);
```
```ruby
const member = {
    '1kumi':{
        '本田':{
            height:180,
            hobby:'チェス'
        },
        '田中':{
            height:160,
            hobby:'サッカー'
        }
    },'2kumi':{
        '中田':{
            height:155,
            hobby:'ダンス'
        },
        '蒼井':{
            height:165,
            hobby:'料理'
        }
    }
};

console.log(member["1kumi"]["本田"]["height"]);
```

**mapオブジェクト**
MDNの中に、Mapオブジェクトについてこのように説明しています。
- Map オブジェクトはキーと値のペアを保持し、キーが最初に挿入された順序を覚えています。
- Map オブジェクトは、その要素について挿入順で反復処理を行うことができます。 for...of ループは各反復で [キー, 値] の配列を返します。

例：
```ruby
const myMap = new Map();
// Mapに値を格納する時に、set(key,value)を使う

myMap.set('id',3);
myMap.set('name','本田');

console.log(myMap);
// get(key)で値を取得することができる
console.log(myMap.get('name'));

// 変数名.values()で連想配列の値を全て取得する
const valueList = myMap.values();
// for~ofで値を順番に取り出す
for(value of valueList){
    console.log(value);
}
```


push(),pop(),unshift(),shift()
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/1a1c344a-8a8e-80f3-6d42-3a2c640533dc.png)
forを使って、リストの要素を取得する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/69231272-e63b-c822-ed5b-6d12ab9b0616.png)
練習
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/870a05f0-0f52-8888-84f3-e20294404ed2.png)

forEach()を使用して、リストの要素を取得することもできる。
MDNの中にforEach()について下記のように説明されている。
-forEach() は、与えられた関数 callback を配列に含まれる各要素に対して一度ずつ、昇順で呼び出します.
-callback()関数とは、関数の中に関数をもう一つ追加する
```ruby
const  fruits = ["りんご","バナナ"];

// callback関数、関数の中に関数をもう一つ追加する
fruits.forEach(function(input){
    console.log(input);
// りんご、バナナが順番に出力する
});
```



slice()を使用して、特定の値を取得することができる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/695c3bdf-6c77-20b2-aee0-ebb05df5307c.png)
splice()を使用して、特定の値を削除することができる。
また、重複している値も削除することができる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/e0e3f34b-221f-0fc2-4c5c-0b020bf4ca04.png)
join(),reverse(),sort()の使い方については下記にまとめた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/c58d4303-7dad-31df-28ca-850eea3d7533.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1067004/3f168d1e-5b58-f4e3-b97f-c3d482115fef.png)