Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

자바스크립트로 스택(Stack) 클래스 직접 구현하기

자바스크립트의 배열(Array)은 사실 스택에 필요한 거의 모든 기능을 이미 제공합니다. 하지만 자료구조의 동작 원리를 깊이 이해하기 위해, 이번 글에서는 스택을 직접 구현한 Stack 클래스를 만들어 보겠습니다.

우리가 만들 클래스는 다음과 같은 메서드를 가집니다.

  • push(element): 스택의 맨 위(top)에 요소를 추가합니다.
  • pop(): 스택 맨 위의 요소를 제거하고 반환합니다.
  • peek(): 스택 맨 위의 요소를 제거하지 않고 반환합니다.
  • isFull(): 스택이 최대 크기에 도달했는지 검사합니다.
  • isEmpty(): 스택이 비어 있는지 검사합니다.
  • clear(): 스택의 모든 요소를 제거합니다.
  • display(): 스택의 전체 내용을 출력합니다.

Stack 클래스의 기본 구조

먼저 스택의 최대 크기를 인자로 받는 생성자와, 개발 과정에서 내부 상태를 확인하는 데 유용한 display() 헬퍼 메서드를 포함한 간단한 클래스부터 정의하겠습니다. 여기에 더해 스택이 가득 찼는지 또는 비어 있는지 확인하는 isFull()isEmpty() 메서드도 함께 정의했습니다.

isFull() 메서드는 컨테이너 배열의 길이가 maxSize보다 크거나 같은지만 검사한 뒤 그 결과를 불리언 값으로 반환합니다.

isEmpty() 메서드는 컨테이너 배열의 크기가 0인지 확인하여 스택이 비어 있는지 판단합니다.

이 두 메서드는 이후 push나 pop 같은 다른 연산을 정의할 때 아주 유용하게 활용됩니다. 앞으로 정의하는 모든 메서드는 Stack 클래스 내부에 작성됩니다.

예제 코드

class Stack {

    constructor(maxSize) {

       // 최대 크기가 전달되지 않으면 기본값 10으로 설정
       if (isNaN(maxSize)) {
           maxSize = 10;
       }
       this.maxSize = maxSize; // 스택 값을 담을 배열 초기화
       this.container = [];
   }

   // 개발 중 내부 내용을 확인하기 위한 메서드
   display() {
       console.log(this.container);
   }

   // 배열이 비어 있는지 확인
   isEmpty() {
       return this.container.length === 0;
   }

   // 배열이 가득 찼는지 확인
   isFull() {
       return this.container.length >= this.maxSize;
   }

   push(element) {
       // 스택이 가득 찼는지 확인
       if (this.isFull()) {
           console.log("Stack Overflow!");
           return;
       }
       this.container.push(element);
   }
}

코드 설명

생성자에서는 isNaN(maxSize) 조건문을 통해 최대 크기가 전달되지 않은 경우 기본값 10을 설정합니다. 이렇게 하면 new Stack()처럼 인자 없이 객체를 생성해도 안전하게 동작합니다.

push() 메서드는 요소를 추가하기 전에 반드시 isFull()을 호출해 스택이 가득 찼는지 먼저 확인합니다. 가득 찬 상태에서 요소를 추가하려고 하면 "Stack Overflow!" 메시지를 출력하고 아무 작업도 수행하지 않습니다.

참고로 원본 예제의 isFull()은 외부 변수 maxSize를 참조하는 실수가 있었지만, 위 코드에서는 this.maxSize를 참조하도록 수정하여 올바르게 동작하도록 정리했습니다.

다음 단계에서는 이 클래스에 pop(), peek(), clear() 메서드를 추가하여 스택의 핵심 연산을 완성하게 됩니다.