GoF 디자인 패턴: 생성 패턴 - 🚀정처기 실기 대비 문제 포함

class Singleton {
  constructor() {
    // 인스턴스가 이미 존재하는지 확인합니다.
    if (Singleton.instance) {
      return Singleton.instance;
    }

    this.message = "나는 클래스 기반 유일 인스턴스야";
    // 없다면, 현재 인스턴스를 저장합니다.
    Singleton.instance = this;
  }
}

// 사용 예시
const a = new Singleton();
const b = new Singleton();

console.log(a === b); // true ✅
console.log(a.message); // "나는 클래스 기반 유일 인스턴스야"

class Logger {
  constructor(name) {
    this.name = name;
    this.logs = [];
  }

  log(message) {
    this.logs.push(`[${this.name}] ${message}`);
  }

  printLogs() {
    console.log(this.logs.join("\n"));
  }
}

// 인스턴스가 두 개 생성된 경우 😵
const loggerA = new Logger("A");
const loggerB = new Logger("B");

loggerA.log("서버 시작");
loggerB.log("DB 연결됨");
loggerA.log("사용자 로그인");

// 로그가 각 인스턴스에 따로 저장됩니다. 😞
loggerA.printLogs();
// [A] 서버 시작
// [A] 사용자 로그인

loggerB.printLogs();
// [B] DB 연결됨

class Logger {
  constructor() {
    if (Logger.instance) {
      return Logger.instance;
    }
    this.logs = [];
    Logger.instance = this;
  }

  log(message) {
    this.logs.push(message);
  }

  printLogs() {
    console.log(this.logs.join("\n"));
  }
}

// 여러 곳에서 Logger를 호출해도 괜찮습니다. 😊
const logger1 = new Logger();
const logger2 = new Logger();

logger1.log("서버 시작");
logger2.log("DB 연결됨");
logger1.log("사용자 로그인");

// 모든 로그가 하나의 인스턴스에 기록됩니다. 🎉
logger1.printLogs();
/*
서버 시작
DB 연결됨
사용자 로그인
*/

console.log(logger1 === logger2); // true ✅

// Product 인터페이스 (결제 게이트웨이)
class PaymentGateway {
  pay(amount) {
    throw new Error("pay()는 반드시 구현되어야 합니다.");
  }
}

// Concrete Product 1 (카드 결제)
class CardGateway extends PaymentGateway {
  pay(amount) {
    console.log(`💳 카드로 ${amount}원 결제 완료`);
  }
}

// Concrete Product 2 (페이팔 결제)
class PaypalGateway extends PaymentGateway {
  pay(amount) {
    console.log(`🅿️ 페이팔로 ${amount}원 결제 완료`);
  }
}

// Creator (상위 결제 처리기)
class PaymentProcessor {
  // 이 메서드는 구체적인 결제 방식에 의존하지 않습니다. 🎯
  process(amount) {
    const gateway = this.createGateway(); // Factory Method 호출
    gateway.pay(amount);
  }

  // Factory Method (하위 클래스가 구체적인 내용을 구현)
  createGateway() {
    throw new Error("createGateway()는 반드시 오버라이드되어야 합니다.");
  }
}

// Concrete Creator 1 (카드 결제 처리기)
class CardPaymentProcessor extends PaymentProcessor {
  createGateway() {
    return new CardGateway();
  }
}

// Concrete Creator 2 (페이팔 결제 처리기)
class PaypalPaymentProcessor extends PaymentProcessor {
  createGateway() {
    return new PaypalGateway();
  }
}

// 사용 예시 ✨
const cardProcessor = new CardPaymentProcessor();
cardProcessor.process(10000); // 💳 카드로 10000원 결제 완료

const paypalProcessor = new PaypalPaymentProcessor();
paypalProcessor.process(20000); // 🅿️ 페이팔로 20000원 결제 완료

// 새로운 Concrete Product
class KakaoPayGateway extends PaymentGateway {
  pay(amount) {
    console.log(`💛 카카오페이로 ${amount}원 결제`);
  }
}

// 새로운 Concrete Creator
class KakaoPayPaymentProcessor extends PaymentProcessor {
  createGateway() {
    return new KakaoPayGateway();
  }
}

// 새로운 기능 바로 사용 가능 🚀
const kakaoProcessor = new KakaoPayPaymentProcessor();
kakaoProcessor.process(15000); // 💛 카카오페이로 15000원 결제

function createGateway(type) {
  if (type === "card") return new CardGateway();
  if (type === "paypal") return new PaypalGateway();
  // '카카오페이' 추가 시 아래 코드 수정이 불가피합니다. 😰
  if (type === "kakaopay") return new KakaoPayGateway(); // ❌ OCP 위반
}

// 💩 매개변수가 너무 많은 생성자
class HttpRequest {
  constructor(method, url, headers, body, timeout, retries, cache, useHttps) {
    this.method = method;
    this.url = url;
    this.headers = headers || {};
    this.body = body || null;
    this.timeout = timeout || 10000;
    this.retries = retries || 3;
    this.cache = cache || false;
    this.useHttps = useHttps || true;
  }
}

// 사용하기가 매우 불편합니다. 😫
const req = new HttpRequest(
  "GET",
  "https://api.example.com/data",
  { "Content-Type": "application/json" },
  null,
  15000,
  5,
  true,
  true
);

// Product (결과물)
class HttpRequest {
  constructor(builder) {
    this.method = builder.method;
    this.url = builder.url;
    this.headers = builder.headers;
    this.body = builder.body;
    this.timeout = builder.timeout;
    this.retries = builder.retries;
    this.cache = builder.cache;
    this.useHttps = builder.useHttps;
  }

  send() {
    console.log(`[${this.method}] ${this.url} 로 요청 전송 🚀`);
    // ... 실제 요청 로직 ...
  }
}

// Builder
class HttpRequestBuilder {
  constructor() {
    // 기본값 설정 ⚙️
    this.method = "GET";
    this.headers = {};
    this.timeout = 10000;
    this.retries = 3;
    this.cache = false;
    this.useHttps = true;
  }

  // 각 설정 메서드는 빌더 인스턴스 자신(this)을 반환합니다. (메서드 체이닝) 🔗
  setMethod(method) {
    this.method = method;
    return this; // 자신을 반환하여 메서드 체이닝 가능
  }

  setUrl(url) {
    this.url = url;
    return this;
  }

  setHeaders(headers) {
    this.headers = headers;
    return this;
  }

  setBody(body) {
    this.body = body;
    return this;
  }

  setTimeout(timeout) {
    this.timeout = timeout;
    return this;
  }

  // ... 다른 설정 메서드들 ...

  // 최종적으로 build() 메서드가 HttpRequest 객체를 생성합니다. 🏗️
  build() {
    if (!this.url) {
      throw new Error("URL은 필수 항목입니다. ⚠️");
    }
    return new HttpRequest(this);
  }
}

// ✨ 사용법이 훨씬 명확하고 유연해졌습니다.
const request = new HttpRequestBuilder()
  .setMethod("POST")
  .setUrl("https://api.example.com/users")
  .setHeaders({ "Content-Type": "application/json" })
  .setBody({ name: "John Doe" })
  .setTimeout(5000)
  .build();

request.send(); // [POST] https://api.example.com/users 로 요청 전송 🚀

// Prototype (원본 객체)
const characterPrototype = {
  hp: 100,
  mp: 50,
  attack(target) {
    console.log(`${this.name}이(가) ${target}을(를) 공격합니다! ⚔️`);
  },
  // 객체를 복제하는 메서드
  clone() {
    // Object.create()를 사용해 프로토타입을 기반으로 새 객체를 만듭니다. 🧬
    return Object.create(this);
  },
};

// 프로토타입을 복제하여 새로운 객체 생성 ✨
const warrior = characterPrototype.clone();
warrior.name = "강한 전사";
warrior.job = "Warrior";
warrior.hp = 150; // 기본값에서 변경

const mage = characterPrototype.clone();
mage.name = "현명한 마법사";
mage.job = "Mage";
mage.mp = 120; // 기본값에서 변경

warrior.attack("오크"); // 강한 전사이(가) 오크을(를) 공격합니다! ⚔️
mage.attack("고블린"); // 현명한 마법사이(가) 고블린을(를) 공격합니다! ⚔️

console.log(warrior.hp); // 150 💪
console.log(mage.hp); // 100 (원본 프로토타입의 값을 그대로 사용) ✅

// Abstract Product A: Button
class Button {
  paint() {
    throw new Error("paint() must be implemented.");
  }
}

// Concrete Product A1: LightButton
class LightButton extends Button {
  paint() {
    console.log("🎨 라이트 테마 버튼을 그립니다. ☀️");
  }
}

// Concrete Product A2: DarkButton
class DarkButton extends Button {
  paint() {
    console.log("🎨 다크 테마 버튼을 그립니다. 🌙");
  }
}

// Abstract Product B: Checkbox
class Checkbox {
  paint() {
    throw new Error("paint() must be implemented.");
  }
}

// Concrete Product B1: LightCheckbox
class LightCheckbox extends Checkbox {
  paint() {
    console.log("✅ 라이트 테마 체크박스를 그립니다. ☀️");
  }
}

// Concrete Product B2: DarkCheckbox
class DarkCheckbox extends Checkbox {
  paint() {
    console.log("✅ 다크 테마 체크박스를 그립니다. 🌙");
  }
}

// Abstract Factory
class GUIFactory {
  createButton() {
    throw new Error("createButton() must be implemented.");
  }
  createCheckbox() {
    throw new Error("createCheckbox() must be implemented.");
  }
}

// Concrete Factory 1: LightThemeFactory
class LightThemeFactory extends GUIFactory {
  createButton() {
    return new LightButton();
  }
  createCheckbox() {
    return new LightCheckbox();
  }
}

// Concrete Factory 2: DarkThemeFactory
class DarkThemeFactory extends GUIFactory {
  createButton() {
    return new DarkButton();
  }
  createCheckbox() {
    return new DarkCheckbox();
  }
}

// Client Code 🎯
function renderUI(factory) {
  const button = factory.createButton();
  const checkbox = factory.createCheckbox();
  button.paint();
  checkbox.paint();
}

// 라이트 테마로 UI 렌더링 ☀️
console.log("--- 라이트 모드 UI ---");
const lightFactory = new LightThemeFactory();
renderUI(lightFactory);
// 🎨 라이트 테마 버튼을 그립니다. ☀️
// ✅ 라이트 테마 체크박스를 그립니다. ☀️

// 다크 테마로 UI 렌더링 🌙
console.log("\n--- 다크 모드 UI ---");
const darkFactory = new DarkThemeFactory();
renderUI(darkFactory);
// 🎨 다크 테마 버튼을 그립니다. 🌙
// ✅ 다크 테마 체크박스를 그립니다. 🌙