알고리즘 문제를 풀기 시작하면서, 기본 자바스크립트 메서드들을 다시 한번 정리하면 좋을 것 같아 정리를 시작해 본다!

가장 먼저, 자바스크립트 배열의 요소를 추가 및 삭제 할 수 있는 메서드들을 알아보자.

• 배열 요소 추가 unshift(), push()
• 배열 요소 삭제 shift(), pop()

1. 배열에 요소 추가

unshift()

배열의 처음에 하나 이상의 요소를 추가하고, 배열의 길이를 반환한다.

const users = ['Charles', 'Cecilia', 'Den'];

const totalUsers = users.unshift('Sherlock', 'John'); 


console.log(totalUsers); // 5 => 배열의 길이를 반환한다. 
console.log(users); // ['Sherlock', 'John', 'Charles', 'Cecilia', 'Den'] => Sherlock과 'John'이 배열의 첫부분에 추가되었다.

push()

배열의 마지막에 하나 이상의 요소를 추가하고, 배열의 길이를 반환한다.

const users = ['Charles', 'Cecilia', 'Den'];

const totalUsers = users.push('Sherlock', 'John'); 


console.log(totalUsers); // 5 => 배열의 길이를 반환한다. 
console.log(users); // ['Charles', 'Cecilia', 'Den', 'Sherlock', 'John'] => Sherlock과 'John'이 배열의 마지막에 추가되었다. 

2. 배열의 요소 삭제

shift()

배열의 첫 요소를 제거하고, 제거된 요소를 반환한다.

const users = [ 'Sherlock', 'John', 'Moriarty' ];
const newUsers = users.shift();

console.log(newUsers); // 'Sherlock' => 배열의 첫 번째 요소인 'Sherlock'가 반환된다. 
console.log(users); // [ 'John', 'Moriarty' ]

pop()

배열의 마지막 요소를 제거하고, 제거된 요소를 반환한다.

const users = ['Sherlock', 'John', 'Moriarty'];
const newUsers = users.pop();

console.log(newUsers); // 'Moriarty' => 배열의 마지막에 있는 'Moriarty'가 반환된다. 
console.log(users); // [ 'Sherlock', 'John' ]

cpop()과 shift()로 배열의 요소 모두 제거하기

shift(), pop()이 제거할 요소가 없는 경우 undefined를 반환하는 특성을 이용하여, 아래와 같이 배열의 요소를 모두 제거 할 수 있다.

let names = ["Andrew", "Edward", "Paul", "Chris" ,"John"];

while( (i = names.pop()) !== undefined ) {
  console.log('제거된요소',i);
  console.log('변경된배열', names)
}

//console.log()의 결과 값들
'제거된요소' 'John'
'변경된배열' [ 'Andrew', 'Edward', 'Paul', 'Chris' ]
'제거된요소' 'Chris'
'변경된배열' [ 'Andrew', 'Edward', 'Paul' ]
'제거된요소' 'Paul'
'변경된배열' [ 'Andrew', 'Edward' ]
'제거된요소' 'Edward'
'변경된배열' [ 'Andrew' ]
'제거된요소' 'Andrew'
'변경된배열' []
```![](https://velog.velcdn.com/images%2Fdev_cecy%2Fpost%2F8bc9fab9-8e9c-4e33-ab5e-301fb208c8ad%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202022-03-22%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%201.53.02.png)