[JavaScript] 배열의 특정 위치에 요소 추가하기

자바스크립트에서는 배열을 추가할 때 push()함수를 사용한다.

 

> const items = ['사과', '딸기', '바나나']

> items.push('자두')

> items
['사과', '딸기', '바나나', '자두']

이처럼 배열.push(값)을 사용하면 마지막 인덱스에 값을 추가할 수 있다.

 

그렇다면 특정 인덱스에 값을 추가하는 방법은 무엇이 있을까?

 

바로 splice() 함수를 사용하는 것이다. 본래 splice는 '접합' 이라는 의미를 가지고 있어서 '자르고 붙이다'라는 뜻을 가지고 있다. 그렇기에 데이터를 자른 후 붙이거나, 추가한 뒤 붙이는 것도 가능하다.

배열.splice(인덱스, 제거할 요소의 개수)

splice()함수는 저렇게 쓰임이 가능한데, 아래 예제를 보자

> const items = ['사과', '딸기', '바나나']

> items.splice(2,1)
["바나나"]

> items
['사과', '딸기']

이렇게 배열.splice(2,1)은 배열의 2번째 인덱스에서부터 1개의 요소를 제거한다는 의미이다.

 

다시 돌아와서 새로운 요소를 추가하는 방법을 알아보자. 먼저 코드를 보여주면

배열.splice(인덱스, 0, 요소)

이렇게 사용하는데 두번째 매개변수에서 0을 준다는 의미는 아무것도 삭제하지 않는다는 의미이다.

그리고 세번째 매개변수에는 추가하고 싶은 요소를 입력하면 된다.

> cosnt items = ['사과', '딸기', '배', '바나나]

> items.splice(2, 0, "자두")

> items
['사과', '딸기', '자두', '배', '바나나]

이렇게 2번째 인덱스에 '자두'라는 값이 추가되는 것을 알 수 있다.

 

이처럼 splice() 메소드는 배열의 특정 위치에 요소를 추가할 수도 있고, 삭제할 수도 있는 함수이다.