splice() 메서드

오늘은 splice메서드에 대해 알아보자.

 

splice

splice 메서드는 JavaScript에서 배열을 수정하는 데 사용된다. 이 메서드는 배열에서 요소를 추가하거나 제거할 수 있다. splice 메서드는 다음과 같은 형식으로 사용된다.

array.splice(start, deleteCount, item1, item2, ...)

 

• start: 배열에서 변경을 시작할 인덱스
• deleteCount: 배열에서 제거할 요소의 수
• item1, item2, ...: 배열에 추가할 요소

배열에서 요소 제거하기

let fruits = ['apple', 'banana', 'cherry', 'date'];
fruits.splice(1, 2); // 인덱스 1에서 2개의 요소를 제거

console.log(fruits); // ['apple', 'date']

 

splice(1, 2) - index 1에서 시작하여 2개의 요소를 배열에서 제거한다.

index 1의 값은 `banana`이다.

index 1에서 시작하여 2개의 요소는 `cherry`이므로 `banana`와 `cherry`가 제거된다.

 

배열에서 요소 추가하기

let animals = ['dog', 'cat', 'rabbit', 'hamster'];
animals.splice(2, 0, 'parrot', 'turtle'); // 인덱스 2에서 요소를 제거하지 않고 'parrot'과 'turtle'을 추가

console.log(animals); // ['dog', 'cat', 'parrot', 'turtle', 'rabbit', 'hamster']

splice(2, 0, 'parrot', 'turtle') - index 2에서 요소를 제거하지 않고 index 2의 위치에 `parrot`과 `turtle`을 배열에 추가한다.

index 2의 값은 `rabbit`이다.

 

 

 

배열에서 요소를 제거하고 새 요소 추가하기

let colors = ['red', 'green', 'blue'];
colors.splice(1, 1, 'yellow', 'purple'); // 인덱스 1에서 1개의 요소를 제거하고 'yellow'와 'purple'을 추가

console.log(colors); // ['red', 'yellow', 'purple', 'blue']

splice(1, 1, 'yellow', 'purple') - 인덱스1에서 1개의 요소를 제거하고 그 자리에 `yellow`와 `purple`를 배열에 추가한다.

index 1에서 시작하여 1개의 요소는 `green`이므로 `green`이 제거된다.

 

배열의 끝에서 요소 제거하기

let animals = ['dog', 'cat', 'elephant'];
animals.splice(-1, 1); // 배열의 마지막 요소를 제거

console.log(animals); // ['dog', 'cat']

 

splice(-1, 1) - index -1에서 시작하여 1개의 요소를 제거한다.

index -1의 값은 `elephant`이다.

 

splice메서드의 주요 특징

 

• 배열의 특정 위치에서 요소를 추가하거나 제거할 수 있다: splice(start, deleteCount, item1, item2, ...)에서 start는 배열에서 변경을 시작할 인덱스이며, deleteCount는 제거할 요소의 수다. item1, item2, ...는 배열에 추가할 요소들이다.
• 원본 배열을 직접 수정한다: splice 메서드는 원본 배열을 직접 변경한다. 새로운 배열을 반환하지 않고, 수정된 배열을 직접 수정한다.
• deleteCount가 0이면 요소를 제거하지 않고, 지정된 위치에 요소를 추가한다: splice(start, 0, item1, item2, ...)에서는 배열에서 요소를 제거하지 않고, start 위치에 item1, item2, ...를 추가한다.
• deleteCount가 1 이상이면, start 위치에서 지정된 수의 요소를 제거한다: splice(start, deleteCount)에서 deleteCount만큼의 요소를 start 위치에서 제거합니다. 제거된 요소들은 메서드의 반환값으로 반환된다.
• start와 deleteCount가 음수일 경우, 배열의 끝에서부터 오프셋으로 간주된다: 음수 인덱스는 배열의 끝에서부터의 상대적인 위치를 의미한다. 예를 들어, -1은 배열의 마지막 요소를 의미한다.