簡單實現批處理

小喬流水喬發表於2018-09-21

使用兩個promise去等待主執行緒任務完成，第一個promise收集所有的資料改動，第二個promise控制render函式在密集的資料更改下只觸發一次。

var obj = {};
var temp_a, temp_b;
var render_dom_count = 0;
Object.defineProperty(obj, 'a', {
    configurable: true,
    enumerable: true,
    get() {
        return temp_a;
    },
    set(v) {
        temp_a = v;
        render();
    }
});
Object.defineProperty(obj, 'b', {
    configurable: true,
    enumerable: true,
    get() {
        return temp_b;
    },
    set(v) {
        temp_b = v;
        render();
    }
});
function render(data) {
    Promise.resolve().then(() => {
        !render_dom_count && (render_dom_count = 1) && console.log('render');
        Promise.resolve().then(() => {
            render_dom_count = 0;
        });
    });
}
function changeAB() {
    obj.a = 1;
    console.log('change a');
    obj.b = 2;
    console.log('change b');
}複製程式碼


相關文章