이 글에서는 첫 번째 인자로 숫자 배열을, 두 번째 인자로 하나의 숫자를 전달받는 자바스크립트 함수를 작성합니다. 함수의 역할은 배열 안에 해당 숫자가 존재하면 그 값을 찾아 제거하고, 그 오른쪽에 있던 모든 요소를 한 칸씩 왼쪽으로 밀어 넣는 것입니다.
단, slice(), splice()처럼 배열의 요소를 직접 삭제하거나 재배치하는 내장 메서드는 사용할 수 없다는 조건이 있습니다. 오직 인덱스 접근과 반복문만으로 문제를 해결해야 합니다. 만약 배열에 같은 숫자가 여러 개 존재한다면 가장 먼저 등장하는 첫 번째 값만 제거하면 됩니다.
문제 예시
입력 배열과 제거할 숫자가 다음과 같다고 가정해 보겠습니다.
const arr = [3, 5, 6, 3, 7, 8, 8, 6]; const num = 7;
숫자 7을 제거하고 뒤쪽 요소들을 앞으로 당기면 결과는 다음과 같습니다.
const output = [3, 5, 6, 3, 8, 8, 6];
해결 코드
const arr = [3, 5, 6, 3, 7, 8, 8, 6];
const num = 7;
const removeElement = (arr = [], num) => {
// 제거할 숫자가 처음 등장하는 인덱스를 찾는다
let index = arr.indexOf(num);
// 배열에 값이 없다면 아무 작업 없이 종료
if (index === -1) {
return;
}
// 찾은 위치부터 끝까지 요소를 한 칸씩 왼쪽으로 이동
while (index + 1 < arr.length) {
arr[index] = arr[index + 1];
++index;
}
// 뒤로 밀린 마지막 중복 값을 제거
arr.pop();
};
removeElement(arr, num);
console.log(arr);
코드 동작 원리
1. 제거할 값의 위치 찾기: indexOf()를 사용해 배열에서 해당 숫자가 처음 등장하는 인덱스를 구합니다. 값이 존재하지 않으면 -1이 반환되며, 이 경우 함수는 아무 일도 하지 않고 즉시 종료됩니다.
2. 요소 한 칸씩 당기기: 찾은 인덱스부터 배열 끝 바로 앞까지 반복하면서 현재 위치에 다음 위치의 값을 덮어씁니다. 이 과정이 끝나면 제거 대상 값은 사라지고, 그 뒤에 있던 요소들이 모두 한 칸씩 앞으로 이동한 상태가 됩니다.
3. 마지막 요소 정리: 요소를 앞당긴 뒤에는 배열 맨 끝에 더 이상 필요 없는 값이 남게 됩니다. pop()으로 마지막 요소를 잘라내어 배열 길이를 하나 줄이면 제거 작업이 완료됩니다.
이 방식은 배열을 한 번만 순회하면 되므로 시간 복잡도가 최악의 경우 O(n)으로, 추가 배열을 만들지 않고도 원본 배열을 그대로 수정하는 매우 효율적인 접근법입니다.
실행 결과
콘솔에 출력되는 결과는 다음과 같습니다.
[ 3, 5, 6, 3, 8, 8, 6 ]