배열은 다양한 메서드를 제공하고, 그 중 유용한것이 많은것 같아 따로 정리를 했다.
우선 앞에서 알아봤던 push, pop, shift, unshift가 있었다.
이 외에 요소 추가와 제거에 대한 메서드를 알아보자.
splice 메서드
splice라는 메서드를 통하여 배열의 요소를 다양하게 핸들링 할 수 있다.
원하는 자리에 요소를 추가한다던지, 혹은 삭제를 한다던지, 수정을한다던지 등등 이 메서드를 통하여 다양한 로직을 구현할 수 있다.
사용 방법은 아래와 같다.
arr.splice(index [, deleteCount, ele1, ele2 ...]);첫번째 매개변수에는 어느 인덱스를 기준으로 할지 기준 인덱스를 넣어준다.
두번째 매개변수로는 기준 인덱스부터 몇개를 삭제할지 갯수를 적어준다.
세번째 매개변수부터는 삭제된자리에 들어갈 요소들을 작성해줄 수 있다.
// 요소의 삭제 let arr = ['a', 'b', 'c', 'd']; arr.splice(1, 1); // 1번 인덱스부터 1개를 삭제한다. console.log(arr); // ['a', 'c', 'd'] // 요소의 수정 arr.splice(0, 1, 'f'); // 0번째 인덱스부터 1개 삭제하고 그 자리에 'f'를 추가 -> 'a'에서 'f'로 수정한 것과 같음 console.log(arr); //['f', 'c', 'd'] // 요소의 추가 arr.splice(0, 0, 'g'); // 0번째 인덱스부터 0개를 삭제하고 0번 인덱스 자리에 'g'를 추가한다. -> 요소의 추가와 같음 console.log(arr); // ['g', 'f', 'c', 'd']
slice 메서드
slice메서드는 배열의 일정 범위를 잘라 새로운 배열로 리턴하는 메서드이다.
arr.slice(startIndex[, endIndex]);시작 인덱스부터 끝인덱스 전까지 요소들을 잘라 새로운 배열로 리턴한다. 여기서 끝 인덱스는 옵션이며, 생략시 배열의 끝까지 자르게된다.
concat 메서드
배열의 요소를 사용해 새로운 배열을 만들거나 또는 기존 배열에 다른 배열을 붙일 때 사용한다.
arr.concat(arg1, arg2...)매개변수로는 배열이나 값이 올 수 있고, 매개변수의 갯수는 제한이 없다.
메서드를 호출하게 되면 arr의 모든 요소와 arg1, arg2... 에 속한 모든 요소를 한데 모은 새로운 배열이 반환된다.
let arr =[1, 2];
arr.concat([3, 4], [5, 6], 7); // [1, 2, 3, 4, 5, 6, 7]concat메서드는 제공받은 배열의 요소를 복사해서 활용한다.
그런데 객체가 인자로 넘어오면 객체는 분해되어 저장되는 것이 아닌 통으로 복사되어 더해진다.
let arr =[1, 2];
let 유사배열 = {
0: "somthing",
length: 1,
};
arr.concat(유사배열); // [1, 2, [object Object]]이렇게 [object Object]라는 값이 추가가 된다.
그런데 인자로 받은 유사 배열 객체에 특수한 프로퍼티인
Symbol.isConcatSpreadable이 존재한다면 concat은 이 객체를 배열처럼 취급한다.
let arr = [1, 2];
let arrayLike = {
0: 'something',
1: 'else',
[Symbol.isConcatSpreadable]: true,
length: 2,
};
console.log(arr.concat(arrayLike)); // 1, 2, something, else