자바스크립트 State Pattern

State Pattern(상태 패턴) 은 객체의 내부 상태에 따라 행동을 변경할 수 있게 만드는 행동 디자인 패턴입니다. 마치 객체의 클래스가 바뀌는 것처럼 동작을 전환할 수 있어, 복잡한 조건문 대신 명확한 상태 기반 구조를 설계할 수 있습니다.

---

🧱 State Pattern이란?

State Pattern은 상태를 별도의 객체로 추출하고, Context 객체가 상태 객체에 행동을 위임하는 구조입니다. 각 상태는 고유한 동작을 가지며, 상태 간 전환도 명확히 정의됩니다.

// 상태 클래스들
class RedLight {
    change(light) {
        console.log("빨간 불 → 초록 불");
        light.setState(new GreenLight());
    }
}

class GreenLight {
    change(light) {
        console.log("초록 불 → 노란 불");
        light.setState(new YellowLight());
    }
}

class YellowLight {
    change(light) {
        console.log("노란 불 → 빨간 불");
        light.setState(new RedLight());
    }
}

// Context 클래스
class TrafficLight {
    constructor() {
        this.state = new RedLight();
    }
    setState(state) {
        this.state = state;
    }
    change() {
        this.state.change(this);
    }
}

const light = new TrafficLight();
light.change(); // 빨간 불 → 초록 불
light.change(); // 초록 불 → 노란 불
light.change(); // 노란 불 → 빨간 불

---

✅ 장점

1. 조건문 제거: 복잡한 if/else나 switch 문 대신 명확한 상태 클래스로 구조화
2. 유지보수 용이: 각 상태가 별도 클래스로 분리되어 수정이 쉬움
3. 확장성 증가: 새로운 상태 추가 시 기존 코드 수정 없이 확장 가능

---

❌ 단점

1. 클래스 수 증가: 상태마다 별도 클래스를 만들어야 함
2. 간단한 경우에는 과한 구조: 상태 전환이 단순할 경우 오히려 복잡함
3. 상태 간 전환 로직이 분산되어 파악이 어려울 수 있음

---

🛠️ 실전 예시: 사용자 인증 상태 관리

class Guest {
    access(app) {
        console.log("게스트는 제한된 기능만 사용 가능합니다.");
        app.setState(new User());
    }
}

class User {
    access(app) {
        console.log("일반 유저 기능 사용 중...");
        app.setState(new Admin());
    }
}

class Admin {
    access(app) {
        console.log("관리자 권한으로 접근합니다.");
        app.setState(new Guest());
    }
}

class AppContext {
    constructor() {
        this.state = new Guest();
    }
    setState(state) {
        this.state = state;
    }
    access() {
        this.state.access(this);
    }
}

const app = new AppContext();
app.access(); // Guest → User
app.access(); // User → Admin
app.access(); // Admin → Guest

---

🧩 결론

State Pattern은 객체의 행동이 상태에 따라 달라지는 시나리오에서 조건문을 제거하고 코드 구조를 명확히 정리할 수 있는 효과적인 패턴입니다. 사용자 인증, UI 상태 전환, 게임 캐릭터 상태 등 다양한 상황에서 활용 가능하며, 유지보수성과 확장성이 중요한 프로젝트에 강력한 솔루션이 됩니다.