javascript - 您存储返回回调的回调的模式是否有名称?

标签 javascript angularjs typescript callback redux

我正在尝试从教程中学习 Redux/Angular,并想知道我刚刚开始理解的这种模式是否有一个名称。

这是完整的文件描述,但我试图识别的模式是通过这些行之间的连接:

使用订阅方法并传入回调函数():

let unsub = SUPER_STORE.subscribe(()=> {
    console.log('subs : ', SUPER_STORE.getState())
});

订阅方法推送监听器并返回回调以删除监听器:

subscribe(listener: ListenerCallback): UnsubscribeCallback {
    this._listeners.push(listener);

    return () => { // returns an "unsubscribe" function
        this._listeners = this._listeners.filter(l => l !== listener);
    };
}

dispatch 方法通过循环遍历集合中的每个 _listener 来处理这些回调。

this._listeners.forEach((listener: ListenerCallback) => listener());

我从未见过这种传入回调并返回新回调以供稍后调用的模式。

问题:

此模式有名称吗?如果是,那是什么?

完整的 JS:

interface Action {
    type: string;
    payload?: any;
}

interface Reducer<T> {
    (state:T, action:Action): T
}

interface ListenerCallback {
    (): void;
}

interface UnsubscribeCallback {
    (): void;
}


class Store<T> {
    private _state:T;
    private _listeners: ListenerCallback[] = [];

    constructor(private reducer:Reducer<T>, initState) {
        this._state = initState;
    }

    getState():T {
        return this._state;
    }

    dispatch(action: Action): void {
        this._state = this.reducer(this._state, action);
        this._listeners.forEach((listener: ListenerCallback) => listener());
    }

    subscribe(listener: ListenerCallback): UnsubscribeCallback {
        this._listeners.push(listener);
        return () => { // returns an "unsubscribe" function
            console.log('unsubscribe');
            this._listeners = this._listeners.filter(l => l !== listener);
        };
    }
}



const SUPER_REDUCE:Reducer<number> = (state:number, action:Action) => {
    switch (action.type) {
        case 'INCREMENT':
            return state + 1;
        default:
            return state;
    }
};

const INCREMENT_ACTION:Action = {type: 'INCREMENT'};

const SUPER_STORE = new Store<number>(SUPER_REDUCE, 0);

let unsub = SUPER_STORE.subscribe(()=> {
    console.log('subs : ', SUPER_STORE.getState())
});

SUPER_STORE.dispatch(INCREMENT_ACTION); // 0
SUPER_STORE.dispatch(INCREMENT_ACTION);  // 1
SUPER_STORE.dispatch(INCREMENT_ACTION);  // 2
SUPER_STORE.dispatch(INCREMENT_ACTION);  // 4

unsub(); // 'unsubscribe'

最佳答案

关于javascript - 您存储返回回调的回调的模式是否有名称?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38711107/

相关文章:

javascript - 当幻灯片可见时触发一个函数,然后在它完成后销毁它,然后重复

angularjs - 使用 mvc Controller 方法对列表进行数据绑定(bind)

javascript - 无法从 AngularJs 中的作用域变量访问二级属性

typescript - 排除 tsconfig.json 中的子目录

javascript - 无法读取未定义的属性(读取 'digest' ) Angular + ipfs 在 https 上构建

angular - 如何将 ngFor 循环的索引值传递给组件?

javascript - 查找包含特定 div 的部分元素的数据索引

javascript - 使用顺序 Promise 在 Javascript 和 jQuery 中运行一些 ajax 请求

javascript - 如何使用 angularjs 从表中删除特定行?

javascript - 嵌套指令 - 无法将参数从 Angularjs 中的子指令传递给 Controller ​​方法