typescript 设计模式--观察者模式

模式定义

在对象之间定义了一对多的依赖，这样一来，当一个对象改变状态，依赖它的对象会收到通知并自动更新。

使用场景

文件上传，并显示上传进度

例子

interface Progress {
    doProgress(percent: number);
}
class UploadFile {
    protected file: File;
    protected progresses: Progress[];
    protected spliteSize: number;
    constructor(file: File, progresses: Progress[], spliteSize: number = 1024) {
        this.file = file;
        this.progresses = progresses;
        this.spliteSize = spliteSize;
    }
    public start() {
        this.split();
    }
    protected split() {
        let splitNum = Math.ceil(this.file.size / this.spliteSize);
        for(let i = 0; i < splitNum; i++) {
            this.upload(i * this.spliteSize);
            this.observeProgress(i/splitNum);
        }
    }
    protected upload(start: number) {
        // ……
    }
    protected observeProgress(percent: number) {
        if(Object.prototype.toString.call(this.progresses) == '[object Arrary]') {
            for(let observe of this.progresses){
                observe.doProgress(percent);
            }
        }
    }
}
class Component implements Progress{
    public OnClick(file: File) {
        let fileUpload = new UploadFile(file, [this]);
    }
    doProgress() {
        // *** 显示进度的操作
    }
}

感觉怪怪的，可能理解有点怪怪的