Array Method

---

📌 배열 메서드 중에는 원본 배열을 직접 변경하는 메서드(mutator method)와 원본 배열을 직접 변경하지 않고 새로운 배열을 생성하여 반환하는 메서드(accessor method)가 있다.
원본 배열을 보존하기 위해 되도록이면 accessor method를 사용하자!

Array.isArray

전달받은 인자가 배열이면 true, 아니면 false를 반환한다

Array.isArray([1, 2]); // true
Array.isArray([]); // true
Array.isArray('1') // false

Array.prototype.indexOf

배열에서 인자로 전달된 element를 검색하여 index를 반환한다.

const arr = [1, 2, 2, 4, 5];

arr.indexOf(1); // 0

arr.indexOf(7); // -1
// 인자로 전달된 element가 존재하지 않으면 -1를 반환한다.

arr.indexOf(2); // 1
// 인자로 전달된 element와 동일한 element가 여러 개인 경우, 가장 작은 index를 반환한다.

arr.indexOf(2, 2) // 2
// 두 번째 전달인자로 검색을 시작할 index을 전달할 수 있다. 생략하면 기본값으로 0이 전달된다.

Array.prototype.join

배열의 모든 element를 string으로 변환한 후, 전달인자, 즉 구분자로 연결된 string을 반환한다.

const arr = [1, 2, 3, 4, 5];

arr.join(); // '1,2,3,4,5'
// 기본 구분자(,)로 연결된 string을 반환한다.

arr.join('') // '12345'
// ''로 연결된 string을 반환한다.

arr.join(6) // '162636465'
// '6'으로 연결된 string을 반환한다.

console.log(arr); // [1, 2, 3, 4, 5]

Array.prototype.includes

배열 내에 특정 element가 포함되어 있으면 true, 없으면 false를 반환한다.

const arr = [1, 2, 3];

arr.includes(2); // true

arr.includes(5); // false

arr.includes(1, 1) // false
// 두 번째 전달인자로 검색을 시작할 index을 전달할 수 있다. 생략하면 기본값으로 0이 전달된다.

Mutator Method

---

Array.prototype.push

전달받은 모든 인자를 원본 배열의 마지막 element로 추가하고 length property 값을 반환한다.

const arr = [1, 2];

let result = arr.push(3, 4);

console.log(result); // 4
console.log(arr); // [1, 2, 3, 4]

⚠️ push 메서드는 함수 호출이라서 성능면에서 좋지 않고 원본 배열을 직접 변경하기 때문에 Spread Syntax를 사용하는 것이 좋다.

Array.prototype.pop

원본 배열에서 마지막 element를 제거하고 제거된 element를 반환한다.

const arr = [1, 2, 3, 4];

let result = arr.pop();

console.log(result); // 4
console.log(arr); // [1, 2, 3]

Array.prototype.unshift

전달받은 모든 인자를 원본 배열의 처음 element로 추가하고 length property 값을 반환한다.

const arr = [1, 2];

let result = arr.unshift(3, 4);

console.log(result); // 4
console.log(arr); // [3, 4, 1, 2]

⚠️ unshift 메서드는 함수 호출이라서 성능면에서 좋지 않고 원본 배열을 직접 변경하기 때문에 Spread Syntax를 사용하는 것이 좋다.

Array.prototype.shift

원본 배열에서 처음 element를 제거하고 제거된 element를 반환한다.

const arr = [1, 2, 3, 4];

let result = arr.shift();

console.log(result); // 1
console.log(arr); // [2, 3, 4]

Array.prototype.reverse

원본 배열의 순서를 반대로 뒤집는다. 변경된 배열이 반환된다.

const arr = [1, 2, 3];

let result = arr.reverse();

console.log(result); // [3, 2, 1]
console.log(arr); // [3, 2, 1]

Accessor Method

---

Array.prototype.concat

전달받은 모든 인자를 마지막 element로 추가한 새로운 배열을 반환한다.
전달인자가 배열인 경우 배열을 해체하여 새로운 배열의 마지막에 추가하고 반환한다.

const arr1 = [1, 2];
const arr2 = [3, 4];

let result = arr1.concat(3, 4);
console.log(result); // [1, 2, 3, 4];

result = arr1.concat(arr2);
console.log(result); // [1, 2, 3, 4];

result = arr1.concat(arr2, 5);
console.log(result); // [1, 2, 3, 4, 5];

console.log(arr1); // [1, 2];

⚠️ unshift, push, concat를 사용하는 것보다 Spread Syntax를 사용하는 것이 직관적이고 성능면에서 좋다.

Array.prototype.slice

전달받은 인자의 범위의 elements로 이루어진 새로운 배열을 반환한다.

const arr = [1, 2, 3, 4, 5];

arr.slice(1, 3); // [2, 3]
// start index부터 end-1 index까지의 elements로 이루어진 새로운 배열을 반환한다.

arr.slice(1); // [2, 3, 4, 5]
// 두 번째 전달인자를 생략하면 length property 값으로 대체된다.

arr.slice(-2); // [4, 5]
// 전달인자가 음수인 경우, 배열의 끝에서부터의 index를 나타낸다.

arr.slice(-3, -1); // [3, 4]

arr.slice(); // [1, 2, 3, 4, 5]
// 전달인자를 모두 생략하면 원본 배열을 복사한 새로운 배열을 반환한다.

console.log(arr); // [1, 2, 3, 4, 5]