배열 메소드 shift/pop/unshift/push

가변 내장 함수 : push(),splice(),pop(),shift()
무결성 내장 함수 : concat(), slice()

1. 배열의 삭제 메소드 : Shift / Pop

shift,pop은 배열의 요소를 삭제하고 삭제한 요소를 반환하는 메소드이다.
shift는 배열의 맨 앞 요소를, pop은 배열의 맨 뒤 요소를 삭제하고 반환한다. shift와 pop은 원본 배열을 변경시킨다.

(1) shift : 배열의 가장 첫 번째 요소를 제거하고 제거된 요소를 반환함.

let arr = [1,2,3];
console.log(arr.shift());//shift의 반환값: 1
console.log(arr); //배열을 호출 : [2,3]

shift()를 콘솔에 찍었더니 배열의 맨 앞의 요소인 1이 나온 것을 확인할 수 있다. 배열을 다시 콘솔에 찍었더니 shift로 인해 삭제된 1을 제외한 배열이 찍인다.

주의 : array.shift() 자체를 반환하면 삭제된 원소만 나온다.
배열을 반환받고 싶다면 변한 array 그자체를 호출하면 된다.

(2) pop : 배열의 가장 마지막 원소를 제거하고 제거된 요소를 반환한다.

let arr1 = [1,2,3];
console.log(arr1.pop()); //pop의 반환값 : 3
console.log(arr1); //배열을 호출 : [1,2]

2. 배열의 추가 메소드 : unShift / Push

unshift, push는 요소를 삽입하고 배열의 길이를 반환하는 메소드이다. unshift는 배열의 가장 앞에 요소를 삽입하고, push는 배열의 가장 끝에 요소를 삽입한다. 앞에 배열의 삭제 메소드와 달리 이 메소드는 추가할 인자가 필요하다.

(1) unshift : 배열의 가장 앞에 원소를 추가하고 변경된 배열의 길이를 반환함.

let arr2 = [1,2,3,4];
console.log(arr2.unshift(0));
//5
console.log(arr2);//[0,1,2,3,4]

unshift()를 실행할 때에는 ()안에 추가할 요소를 넣어야 한다.
arr2.unshift()를 콘솔에 찍었더니 추가된 0을 포함한 배열 길이 5가 반환되었다.

(2)push : 배열의 가장 마지막에 원소를 추가하고 변경된 배열의 길이를 반환함.

let arr3 = [1,2,3,4];
console.log(arr3.push(5));
//5
console.log(arr3);
//[1,2,3,4,5]

push()의 사용법은 unshift와 동일하다. push 또한 ()안에 추가할 숫자를 넣어줘야 하는 메소드이다. 5를 추가했더니 배열은 [1,2,3,4,5]으로 바뀌었고 배열의 길이인 5가 출력되었다. 배열자체를 다시 출력했더니 변화된 배열이 잘 출력된다.

★ 정리

1. 배열 메소드 shift,unshift,pop,push는 배열을 출력하지 않는다. shift,pop은 삭제된 요소를, unshift,push는 변화된 배열의 길이를 반환한다. 배열을 반환하고 싶다면 배열 그 자체를 호출해야 한다.
2. shift, unshift는 비슷해 보여서 헷깔리기 쉽다. 앞과 같은 차이점도 있지만 shift는 삭제 메소드, unshift는 추가 메소드이다. 하지만 둘 다 배열의 맨 앞을 변경시키는 메소드라는 점에서는 동일하다.