JavaScript~配列の操作~その１

配列の操作をまとめました。
間違いがあったらご指摘いただけると嬉しいです。

続き[JavaScript~配列の操作~その２](https://qiita.com/yoshihide_tsukamoto/items/af650a708fc22d9ba488)

###使用する配列

```javascript

const array1 = [1, 2, 3, 4, 5]
const array2 = [6, 7, 8, 9, 10]
```
※別の配列を使う場合はコード内に記載。
>#破壊的メソッド(元の配列を変更する)

##push (末尾に追加)

```javascript
const result = array1.push(6)//戻り値は配列の長さ
console.log(result) //6
console.log(array1) //[ 1, 2, 3, 4, 5, 6 ]
```
```javascript
array1.push(array2)
console.log(result) //6
console.log(array1) //[ 1, 2, 3, 4, 5, [ 6, 7, 8, 9, 10 ] ]
```

##unshift (先頭に追加)
```javascript
const result = array1.unshift(0) //戻り値は配列の長さ
console.log(result) //6
console.log(array1) //[ 0, 1, 2, 3, 4, 5 ]
```

```javascript

array1.unshift(array2)
console.log(result) //6
console.log(array1) //[ [ 6, 7, 8, 9, 10 ], 1, 2, 3, 4, 5 ]
```

##pop (末尾を削除)
```javascript
const result = array1.pop()//戻り値は削除した値
console.log(result)//5
console.log(array1)//[ 1, 2, 3, 4 ]
```

##shift (先頭を削除)
```javascript
const result = array1.shift()//戻り値は削除した値
console.log(result)//1
console.log(array1)//[ 2, 3, 4, 5 ]
```

##splice (値の追加や削除)
```javascript
const result1 = array1.splice(1, 2)//戻り値は削除した値
console.log(result1)//[ 2, 3 ]
console.log(array1)//[ 1, 4, 5 ]
```

```javascript
const result2 = array1.splice(1, 2, "Hello", "Bye")
console.log(result2)//[ 2, 3 ]
console.log(array1)//[ 1, 'Hello', 'Bye', 4, 5 ]
```

``第一引数``、どこから。``第二引数``、削除する数。``第三引数以降``、追加する値。

##copyWithin
```javascript
const result1 = array1.copyWithin(1, 3)//[1]の(2)の場所に、[3]からの(4，5)をコピー
console.log(result1) //[1, 4, 5, 4, 5]
console.log(array1) //[1, 4, 5, 4, 5]

const result2 = array2.copyWithin(1, 2, 4)//[1]の(7)の場所に、[2]から[4]までの(8, 9)をコピー
console.log(result2) //[6, 8, 9, 9, 10 ]
console.log(array2) //[6, 8, 9, 9, 10 ]
```

``第一引数``、どこに。``第二引数``、どこから。``第三引数``(省略可能)、どこまで。

##reverse (逆転)
```javascript
const result = array1.reverse()
console.log(result) //[ 5, 4, 3, 2, 1 ]
console.log(array1) //[ 5, 4, 3, 2, 1 ]
```
##sort (並び替え)
```javascript
const array = [3, 5, 2, 1, 4]
const result = array.sort()
console.log(result)
console.log(array)
```
```javascript
const users = [ {name: "J", age: 40}, {name: "A", age: 29}, {name: "M", age: 13}, {name: "T", age: 65}, {name: "B", age: 88}]
users.sort((a, b) => a.age - b.age)//ageで昇順
console.log(users)
/*[
    { name: 'M', age: 13 },
    { name: 'A', age: 29 },
    { name: 'J', age: 40 },
    { name: 'T', age: 65 },
    { name: 'B', age: 88 }
 ] */
users.sort((a, b) => b.age - a.age)//a,bを入れ替えると降順
console.log(users)
/*[
    { name: 'B', age: 88 },
    { name: 'T', age: 65 },
    { name: 'J', age: 40 },
    { name: 'A', age: 29 },
    { name: 'M', age: 13 }
  ]*/
```
nameでのソート

```javascript
users.sort((a, b) => {
  if (a.name > b.name) {
    return 1
  } else {
    return -1
  }
})
console.log(users)
/*[
    { name: 'A', age: 29 },
    { name: 'B', age: 88 },
    { name: 'J', age: 40 },
    { name: 'M', age: 13 },
    { name: 'T', age: 65 }
 ]*/
```

##fill (特定の値で埋める)

```javascript
const array = new Array(10).fill(1)
console.log(array)
array.fill("a", 2)//[2]から"a"にする
console.log(array)//[ 1, 1, 'a', 'a', 'a', 'a', 'a', 'a', 'a', 'a' ]
array.fill("b", 3, 7)//[3]から[7]の前までを"b"にする
console.log(array) //[ 1, 1, 'a', 'b', 'b', 'b', 'b', 'a', 'a', 'a' ]
```
``第一引数``、入れる値。``第二引数``、どこから。``第三引数``、どこまで。

>#非破壊的メソッド(新しい配列を返す)

##concat (配列の結合)

```javascript
const result = array1.concat(array2)
console.log(array1)//[ 1, 2, 3, 4, 5 ]
console.log(result)//[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]
```
基本的には下で紹介する、スプレッド演算子を使用

##... スプレッド演算子 (配列の展開)
```javascript
const result1 = [...array1, ...array2]
console.log(result1)//[ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]
const result2 = [ 0, ...result1, 11]
console.log(result2)//[ 0, 1, 2, 3, 4, 5, 6, 7,  8, 9, 10, 11 ]
console.log(array1)//[ 1, 2, 3, 4, 5 ]
console.log(array2)//[ 6, 7, 8, 9, 10 ]
```
配列に対して``...``を使う事で展開できる。

##slice (部分配列)

```javascript
const result1 = array1.slice(2)//第二引数を指定しなかった場合は指定した場所からの全ての値
const result2 = array1.slice(1, 4)//[1]から[4]まで
const result3 = array1.slice(-3, -1)//-を使うと最後からになる
console.log(result1)//[ 3, 4, 5 ]
console.log(result2)//[ 2, 3, 4 ]
console.log(result3)//[ 3, 4 ]
console.log(array1)//[ 1, 2, 3, 4, 5 ]
```
``第一引数``、どこから。``第二引数``(省略可能)、どこまで(指定した場所のひとつ前)。


以上！