[ 자주 쓰이는 자바스크립트 Array 함수 2 ] pop, shift, unshift, slice, splice

핵심 Keyword

1. 출처 : https://velog.io/@saemileee/JavaScript-%EC%9E%90%EC%A3%BC-%EC%93%B0%EC%9D%B4%EB%8A%94-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-Array-%ED%95%A8%EC%88%98-5%EA%B0%9C-1%ED%83%84-push-forEach-filter-map-reduce

2. 

3. 

---

 pop( )

pop( ) 은 배열의 마지막 요소를 제거하는 함수인데요. 마지막 요소를 제거하고 제거한 요소를 반환하는 특징을 가지고 있습니다. 

빈 배열에 pop( )을 사용했을 때는 undefined 를 리턴합니다. 

let arr = [1, 2, 3];
let result = arr.pop( );

 

 shift( )

shift 는 pop 의 반대로 동작하는 친구입니다. 반대로 제일 앞의 첫 번째 요소를 제거하고 리턴하는 특징이 있습니다.

마찬가지로 빈 배열에 shift 를 사용하면,  undefined 를 리턴하며 배열의 length 는 0이 됩니다. 

let arr = [1, 2, 3];
let result = arr.shift( );

 

 unshift( )

unshift( ) 는 말 그대로 shift 의 반대의 동작을 수행합니다. 배열의 맨 앞에 요소를 제거하는 것이 아니라, 반대로 추가해준다는 뜻입니다.

특징으로는 매개변수로 한 개가 아니라, 여러 개를 줄 수 있다는 점입니다. 

let arr = [1, 2, 3];
arr.unshift(4, 5);

 

 slice( )

slice( )는 말 그대로, 배열의 원하는 부분을 잘라서 반환하는 메소드입니다.

특징으로는 시작인덱스와 마지막 인덱스를 매개변수로 받아서 거기에 해당하는 부분을 잘라서 반환한다는 특징이 있습니다.

또 다른 특징으로는 '음수'를 입력하면 뒤에서부터 인덱스를 카운팅해서 반환해준답니다. 

마지막 특징으로는 배열을 복사할 때, 편리하게 사용된다는 것인데요. 매개변수로 아무것도 안주면, 그냥 새로운 배열 복사본을 반환하는 특징이 있답니다.

let arr = [1, 2, 3];
let newArr = arr.slice();

let newArr2 = arr.slice(0,1);

let newArr3 = arr.slice(-2,-1);
//slice 0,1 의 결과는 0 인덱스의 것만 반환되지만, -2 -1 의 결과는 -2와 -1 인덱스에 해당하는
//모든것이 반환된다는 특징이 있으니 주의하세요.

 

 splice( )

splice( ) 는 slice( )가 잘라낸 부분을 반환했다면, splice( ) 는 잘라낸 부분을 제외한 나머지 부분을 반환하는 메소드라고 이해하시면 쉽습니다. 

특징으로는 매개변수로 시작 인덱스, 삭제할 요소의 개수, 추가할 요소를 받습니다. 

또 다른 특징으로는 추가할 요소 여러개를 지정할 수도 있다는 점입니다. 

let arr = [1, 2, 3];
let newArr = arr.splice(1,2,1,2,3);
//index 1 에서부터 2개를 1, 2, 3 으로 대체합니다.