자바스크립트로 큐(Queue)에서 요소 제거하기 — Dequeue 구현 방법

큐(Queue)에서 디큐(Dequeue)란 큐의 맨 앞(front/head)에 있는 요소를 제거하는 작업을 의미합니다. 큐는 FIFO(First In, First Out, 선입선출) 구조이기 때문에, 가장 먼저 들어온 데이터가 가장 먼저 나가야 하며, 이때 제거되는 위치가 바로 큐의 head입니다.

이 글에서는 컨테이너 배열(container array)의 시작 부분을 큐의 head로 간주하고, 모든 연산을 이 기준으로 수행합니다.

dequeue 함수 구현하기

배열의 시작 부분이 곧 큐의 head이므로, 자바스크립트 배열이 기본 제공하는 shift() 메서드를 활용하면 간단하게 dequeue를 구현할 수 있습니다. 단, 큐가 비어 있는 상태에서 요소를 제거하려고 하면 안 되므로, 먼저 isEmpty()로 비어 있는지 검사한 뒤 처리해야 합니다.

dequeue() {
    // 큐가 비어 있는지 확인
    if (this.isEmpty()) {
        console.log("Queue Underflow!");
        return;
    }
    return this.container.shift();
}

여기서 shift() 메서드는 배열의 첫 번째 요소를 제거하면서 그 값을 반환하므로, 큐의 head에서 요소를 꺼내는 동작과 정확히 일치합니다.

동작 확인하기

다음 코드를 실행하면 dequeue 함수가 정상적으로 동작하는지 확인할 수 있습니다.

let q = new Queue(2);
q.dequeue();
q.enqueue(3);
q.enqueue(4);
console.log(q.dequeue());
q.display();

실행 결과

위 코드를 실행하면 다음과 같은 출력을 얻습니다.

Queue Underflow!
3
[ 4 ]

결과 분석

출력 결과를 살펴보면 다음과 같은 흐름을 확인할 수 있습니다.

• 처음 생성된 큐는 비어 있으므로, 가장 먼저 호출한 dequeue()는 "Queue Underflow!" 메시지를 출력하며 아무것도 제거하지 않습니다.
• 이후 3이 먼저 큐에 들어가고, 그다음 4가 들어갑니다.
• 다시 dequeue()를 호출하면 FIFO 원칙에 따라 먼저 들어간 3이 제거되어 반환됩니다.
• 마지막으로 큐에는 [ 4 ]만 남게 됩니다.

만약 이 방식이 직관적이지 않게 느껴진다면, 반대로 삽입은 배열의 앞에서, 삭제는 배열의 끝에서 수행하도록 구현할 수도 있습니다. 다만 이 시리즈에서는 계속 지금까지의 방식(앞에서 제거, 뒤에서 삽입)을 사용하도록 하겠습니다.