[7일차] 옵저버 | 행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴

 

출처: 에릭 감마 , 리처드 헬름 , 랄프 존슨 , 존 블리시디스. 『Gof의 디자인 패턴』. 김정아(역). 프로텍미디어, 2015.

 

 

[7일차] 옵저버(Observer)
행동 패턴 11일만에 끝내기 챌린지 - GoF 디자인 패턴

타입스크립트로 설명하는 GoF 디자인 패턴의 행동 패턴 11일만에 끝내기 챌린지

 

 

옵저버란?

객체 사이에 일대 다의 의존 관계를 정의해두어,
어떤 객체의 상태가 변할 때 그 객체에 의존성을 가진 다른 객체들이
그 변화를 통지 받고 자동으로 갱신될 수 있게 만듭니다.

 

 

활용성

1) 어떤 추상 개념이 두 가지 양상을 갖고
하나가 다른 하나에 종속적일 때.
각 양상을 별도의 객체로 캡슐화하여 이들 각각을 재사용할 수 있습니다.

2) 한 객체에 가해진 변경으로 다른 객체를 변경해야 하고,
프로그래머들은 얼마나 많은 객체들이 변경되어야 하는지 몰라도 될 때

3) 어떤 객체가 다른 객체에 자신의 변화를 통보할 수 있는 데,
그 변화에 관심있어 하는 객체들이
누구인지에 대한 가정 없이도 그러한 통보가 될 때

 

 

구조 및 구현

interface Observer {
    update(): void
}

abstract class Subject {
    private observers: Set<Observer> = new Set()
    
    attach(observer: Observer) {
        this.observers.add(observer)
    }
    
    detach(observer: Observer) {
        this.observers.delete(observer)
    }
    
    notify() {
        this.observers.forEach(observer => {
            observer.update()
        })
    }
}

class ConcreteSubject extends Subject {
    private subjectState = ''
    getState() {
        return this.subjectState
    }
    setState(state: string) {
        this.subjectState = state
    }
}

class ConcreteObserver implements Observer {
    private subject: ConcreteSubject
    private observerState = ''
    
    constructor(subject: ConcreteSubject) {
        this.subject = subject
        this.subject.attach(this)
    }

    update() {
        console.log('updated')
        this.observerState = this.subject.getState()
    }
}

 

class Main {
    constructor() {
        const subject = new ConcreteSubject()
        const observer1 = new ConcreteObserver(subject)
        const observer2 = new ConcreteObserver(subject)

        subject.notify() // updated updated
        subject.detach(observer1)
        subject.notify() // updated
    }
}

 

 

---

 

 

공식 기술블로그 링크

더넥스트웹리서치랩