반응형
Notice
Recent Posts
Recent Comments
Link
250x250
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

동글이의 STORY

전략 패턴 본문

Javascript/자바스크립트 패턴

전략 패턴

dongling 2024. 7. 3. 21:55
728x90
반응형
SMALL

🔶 전략 패턴?

  • 객체 지향 디자인 패턴 중 하나로 동일한 문제를 해결하기 위한 여러 알고리즘을 정의, 각가의 캡슐화하여 상호 교환 가능하도록 만드는 패턴
  • 런타임 시에 알고리즘을 선택하고 적용할 수 있게 됨

장점

  • 유연성 : 새로운 전략을 추가하거나 기존 전략을 수정하기 쉬움
  • 재사용성 : 전략을 재사용 할 수 있어서 개발비용과 시간을 절약할 수 있음
  • 테스트 용이성 : 각 전략을 독립적으로 테스트할 수 있기 때문에 테스트가 용이

단점

  • 클래스 개수 : 각 전략이 별도의 클래스로 캡슐화 되기 때문에 클래수 수 증가 → 코드 복잡성을 높이고 유지보수 어려워짐
  • 오버헤드 : 런타임에 전략을 교체하기 때문에 오버헤드 발생 가능성 있음

정렬 알고리즘

  • BubbleSort, QuickSort, insertionSort 등
  • Sorter 클래스가 전략 패턴을 구현한 클래스
  • Sorter는 생성자에서 전달받은 전략 객체의 sort 메소드를 호출하여 정렬을 수행하게 된다.
// BubbleSortStrategy: 버블 정렬 알고리즘
class BubbleSortStrategy {
  sort(arr) {
    let len = arr.length;
    for (let i = 0; i < len; i++) {
      for (let j = 0; j < len - 1 - i; j++) {
        if (arr[j] > arr[j + 1]) {
          let temp = arr[j + 1];
          arr[j + 1] = arr[j];
          arr[j] = temp;
        }
      }
    }
    return arr;
  }
}

// QuickSortStrategy: 퀵 정렬 알고리즘
class QuickSortStrategy {
  sort(arr) {
    if (arr.length <= 1) {
      return arr;
    }

    let pivotIndex = Math.floor(arr.length / 2);
    let pivot = arr.splice(pivotIndex, 1)[0];

    let left = [];
    let right = [];

    for (let i = 0; i < arr.length; i++) {
      if (arr[i] < pivot) {
        left.push(arr[i]);
      } else {
        right.push(arr[i]);
      }
    }

    return this.sort(left).concat([pivot], this.sort(right));
  }
}

// Sorter: 정렬을 수행하는 클래스
class **Sorter** {
  constructor(strategy) {
    this.strategy = strategy;
  }

  sort(arr) {
    return this.strategy.sort(arr);
  }
}

// 예시 코드
let arr = [5, 2, 4, 6, 1, 3];

let bubbleSorter = new Sorter(new BubbleSortStrategy());
console.log(bubbleSorter.sort(arr)); // [1, 2, 3, 4, 5, 6]

let quickSorter = new Sorter(new QuickSortStrategy());
console.log(quickSorter.sort(arr)); // [1, 2, 3, 4, 5, 6]
728x90
반응형
LIST

'Javascript > 자바스크립트 패턴' 카테고리의 다른 글

장식자 패턴  (0) 2024.07.03
샌드박스 패턴  (0) 2024.07.03
네임스페이스 패턴  (0) 2024.07.03
팩토리 패턴  (0) 2024.07.03
싱글톤 패턴  (0) 2024.07.03