본문 바로가기
알고리즘 스터디/자바스크립트 문법정리

slice(), splice() 함수 - 자바스크립트 배열 자르기 - 자바스크립트[JavaScript]

by 레일라오리덕 2021. 7. 21.
728x90

slice() 함수 : 원래 배열의 상태가 변하지 않는다.

splice() 함수 : 원래 배열에서 삭제된 요소를 제거한 배열을 반환한다.

 

slice(인덱스 시작점(해당 인덱스 포함), 인덱스 종료지점(해당 인덱스 불포함))

 

var alphabet = ['a', 'b', 'c', 'd', 'e'];
var arr = alphabet.slice(2, 4); // ['c', 'd'] 
//배열의 인덱스 2인 c부터 인덱스 4를 포함하지 않으므로 인덱스 3까지 잘라냄

 

splice(인덱스 시작점(해당 인덱스 포함), 제거할 요소의 갯수)

 

var alphabet = ['a', 'b', 'c', 'd', 'e'];
alphabet.splice(2, 2); // ["a", "b", "e"] //인덱스 2부터 2개 값 제거

var alphabet = ['a', 'b', 'c', 'd', 'e'];
alphabet.splice(2, 1, 'z'); //["a", "b", "z", "d", "e"] //인덱스 2에서부터 1개 값 제거 후, 'z' 값 추가

var alphabet = ['a', 'b', 'c', 'd', 'e'];
alphabet.splice(2, 0, 'z'); //["a", "b", "z", "c", "d", "e"] //인덱스 2에서부터 아무것도 제거하지않고, 'z' 값 추가

var alphabet = ['a', 'b', 'c', 'd', 'e'];
alphabet.splice(-2, 1); //["a", "b", "c", "e"] //인덱스 -2에서부터 1개 요소 제거

var alphabet = ['a', 'b', 'c', 'd', 'e'];
alphabet.splice(2); //["a", "b"] //인덱스 2에서부터 모든 요소 제거

위와 같이 배열 내의 요소 제거 뿐만 아니라, 요소 추가도 가능한 함수입니다. 

제거한 요소의 위치에 추가한 값이 들어간다는 점을 기억해둬야할 것 같습니다.

또한, splice함수에서는 -1이나 -2와 같은 음수 값 인덱스도 지정해 줄 수 있는데, -1 인덱스는 배열의 가장 마지막, -2 인덱스는 배열의 가장 마지막에서 두번째 요소를 가르킨다는 점 또한 중요한 것 같습니다.

 


아래는 관련 함수 사용 코딩테스트 예제입니다.

 

https://leylaoriduck.tistory.com/457?category=781765 

 

[프로그래머스 스킬체크 레벨 1] 신규 아이디 추천 풀이 및 설명 - 자바스크립트[JavaScript]

https://programmers.co.kr/learn/courses/30/lessons/72410 코딩테스트 연습 - 신규 아이디 추천 카카오에 입사한 신입 개발자 네오는 "카카오계정개발팀"에 배치되어, 카카오 서비스에 가입하는 유저들의 아이

leylaoriduck.tistory.com

 

728x90

댓글