배열 메소드

🚩 join

배열의 모든 요소를 연결해 하나의 문자열로 만듭니다.

const arr = ['a', 'b', 'c'];

console.log(arr.join()); // a,b,c
console.log(arr.join('')); // abc
console.log(arr.join('-')); // a-b-c

 

🚩 splice

배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가합니다.

원본 배열의 내용을 변경합니다. ( *원본 배열을 변경하지 않으려면 .toSpliced() 사용 )

반환값은 제거한 요소를 담은 배열

.slice(인덱스, 삭제할 개수, 추가할 아이템)

const arr = ['a', 'b', 'c'];
const result = arr.splice(1, 1);

console.log(arr); // ['a', 'c'] → 1번 인덱스부터 요소 1개 제거
console.log(result); // ['b'] → 제거한 요소를 담은 배열 반환

const arr = ['a', 'b', 'c'];
const result = arr.splice(1, 1, 'd');

console.log(arr); // ['a', 'd', 'c'] → 1번 인덱스부터 1개 제거 후, 'd' 추가
console.log(result); // ['b'] → 제거한 요소를 담은 배열 반환

const arr = ['a', 'b', 'c'];
const result = arr.splice(1, 0, 'd');

console.log(arr); // ['a', 'd', 'b', 'c'] → 1번 인덱스부터 0개 제거 후, 'd' 추가
console.log(result); // [] → 제거된 요소가 없기 때문에 빈 배열 반환

 

🚩 slice

배열의 begin부터 end까지(end 미포함)에 대한 새로운 배열 반환합니다.

원본 배열은 바뀌지 않습니다.

.slice(begin 인덱스, end 인덱스)

const arr = ['a', 'b', 'c'];
const result1 = arr.slice(1, 2);
const result2 = arr.slice(1);

console.log(arr); // ['a', 'b', 'c'] → 원본 배열은 바뀌지 않음
console.log(result1); // ['b'] → 1번 인덱스부터 1번 인덱스로 이루어진 새로운 배열 반환
console.log(result2); // ['b', 'c'] → 1번 인덱스부터 마지막 인덱스로 이루어진 새로운 배열 반환

 

🚩 shift

배열에서 첫 번째 요소를 제거하고, 제거된 요소를 반환합니다.

원본 배열이 변경됩니다.

const arr = ['a', 'b', 'c'];
const first = arr.shift();

console.log(arr); // ['b', 'c'] → 첫 번째 요소 제거
console.log(first); // a → 제거된 요소 반환

 

🚩 unshift

새로운 요소를 배열의 맨 앞쪽에 추가하고, 새로운 길이를 반환합니다.

원본 배열이 변경됩니다.

const arr = ['a', 'b', 'c'];
const length = arr.unshift('e');

console.log(arr); // ['e', 'a', 'b', 'c'] → 'e'를 맨 앞에 추가
console.log(length); // 새로운 길이 반환

 

🚩 reduce / reduceRight

배열의 요소들을 돌면서 값을 계산하고, 그 값을 반환합니다.

// prev: 이전 콜백함수의 반환값이 저장됩니다.
// curr: 순차적으로 배열의 요소 반환

// 배열의 왼쪽에서 오른쪽으로 계산
reduce((prev, curr) => prev + curr, 초기값)

// 배열의 오른쪽에서 왼쪽으로 계산
reduceRight((prev, curr) => prev + curr, 초기값)

const arr = [1, 2, 3];
const sum = arr.reduce((prev, curr) => prev + curr, 0);

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

const arr = [1, 2, 3];
const sum = arr.reduceRight((prev, curr) => prev + curr, 0);

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

 

🚩 sort

배열의 요소를 정렬한 후, 그 배열을 반환합니다.

원본 배열이 변경됩니다. ( *원본 배열을 변경하지 않으려면 .toSorted() 사용 )

const arr = [2, 1, 3];
const result = arr.sort((a, b) => a - b);

console.log(arr); // [1, 2, 3] → 오름차순
console.log(result); // [1, 2, 3]

const arr = [2, 1, 3];
const result = arr.sort((a, b) => b - a);

console.log(arr); // [3, 2, 1] → 내림차순
console.log(result); // [3, 2, 1]

 

 

🚩 reverse

배열의 순서를 반전합니다.

원본 배열이 변경됩니다. ( *원본 배열을 변경하지 않으려면 .toReversed() 사용 )

const arr = [1, 2, 3];
const result = arr.reverse();

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