JavaScript/배열

[JavaScript]배열 마지막 요소 제거하는 방법

DevStory 2022. 9. 17.

배열 마지막 요소 제거하는 방법

이번 포스팅은 JavaScript에서 배열의 마지막 요소를 제거하는 몇 가지 방법을 소개합니다.


방법 1. pop 메서드(권장)

첫 번째 방법으로 배열에서 제공하는 pop() 메서드를 사용하여 배열의 마지막 요소를 제거할 수 있습니다.

 

pop() 메서드는 배열의 마지막 요소를 제거하고 해당 요소를 반환합니다. 빈 배열에서 pop() 메서드를 호출하면, undefined를 반환합니다.

 

다음 예제는 pop() 메서드를 호출하여 문자열 배열의 마지막 요소를 제거합니다.

const strArray = ['Zero', 'One', 'Two', 'Three', 'Four'];
const popResult = strArray.pop();

console.log(strArray);
console.log("pop() 메서드 반환 결과: " + popResult);

[실행 결과]

['Zero', 'One', 'Two', 'Three']
pop() 메서드 반환 결과: Four

방법 2. splice 메서드

두 번째 방법으로 배열에서 제공하는 splice() 메서드를 사용하여 배열의 마지막 요소를 제거할 수 있습니다.

 

splice() 메서드는 배열의 요소를 제거하거나 추가할 수 있으며, 메서드의 반환 결과는 없습니다.

 

첫 번째 매개변수로 -1 또는 (배열의 길이 - 1)을 전달합니다. 매개변수로 음수(-n)를 전달하면, (배열의 길이 - n)과 동일하게 동작합니다.

 

두 번째 매개변수를 생략하면, 첫 번째 매개변수부터 모든 요소를 제거합니다.

 

다음 예제는 splice() 메서드를 호출하여 문자열 배열의 마지막 요소를 제거합니다.

const strArray = ['Zero', 'One', 'Two', 'Three', 'Four'];
strArray.splice(strArray.length - 1);

console.log(strArray);

 [실행 결과]

['Zero', 'One', 'Two', 'Three']

방법 3. slice 메서드

배열의 slice() 메서드는 시작 위치(begin)부터 마지막 위치(end)까지 요소로 구성된 새로운 배열을 생성합니다.

 

원본 배열의 데이터를 보존하고 싶은 경우 slice() 메서드를 사용하여 마지막 요소가 제거된 새로운 배열을 생성할 수 있습니다.

 

첫 번째 매개변수로 0을 전달하고 두 번째 매개변수로 -1 또는 (배열의 길이 - 1)을 전달합니다. 두 번째 매개변수로 음수(-n)를 전달하면, (배열의 길이 - n)과 동일하게 동작합니다.

 

다음 예제는 slice() 메서드를 호출하여 문자열 배열의 마지막 요소가 제거된 새로운 배열을 생성합니다.

const strArray = ['Zero', 'One', 'Two', 'Three', 'Four'];
const newArray = strArray.slice(0, strArray.length - 1);

console.log(strArray);
console.log(newArray);

[실행 결과]

['Zero', 'One', 'Two', 'Three', 'Four']
['Zero', 'One', 'Two', 'Three']

방법 4. filter 메서드

slice() 메서드와 마찬가지로 원본 배열의 데이터를 보존하고 싶은 경우 filter() 메서드를 사용할 수 있습니다.

 

filter() 메서드의 매개변수는 특정 조건에 대한 결과를 Boolean 값으로 반환하는 로직이 포함된 콜백 함수입니다. filter() 메서드는 특정 조건을 만족하는 요소로 구성된 새로운 배열을 생성합니다.

 

filter() 메서드의 콜백 함수는 세 가지 매개변수를 가지며, 첫 번째 매개변수는 현재 배열의 요소, 두 번째 매개변수는 현재 배열의 인덱스입니다.

 

두 번째 매개변수(현재 배열의 인덱스)가 (배열의 길이 - 1)보다 작은 요소로 구성된 새로운 배열을 생성하여 배열의 마지막 요소를 제거할 수 있습니다.

 

다음 예제는 filter() 메서드를 호출하여 문자열 배열의 마지막 요소가 제거된 새로운 배열을 생성합니다.

const strArray = ['Zero', 'One', 'Two', 'Three', 'Four'];
const newArray = strArray.filter((item, index) => index < strArray.length - 1);

console.log(strArray);
console.log(newArray);

[실행 결과]

['Zero', 'One', 'Two', 'Three', 'Four']
['Zero', 'One', 'Two', 'Three']

정리

  • 배열의 마지막 요소를 제거하고 싶으면, pop(), splice() 메서드를 사용합니다.
  • 배열의 데이터를 변경하지 않고 마지막 요소가 제거된 새로운 배열을 생성하고 싶다면, slice(), filter() 메서드를 사용합니다.
반응형

댓글