乐趣区

关于javascript:队列在项目中的应用

参考:集体博客原文链接

这次总算是用上了数据结构啦,不然我本人也快忘了,常识只有在应用的前提下,才是活的常识,才不容易遗记。这次在我的项目中用到的是队列,当然这里不是为了秀,只是为了记录、总结,分享开发中的心得。

工作需要是管制多个弹窗的展现,须要有优先级,同时也须要依据数据的状态,来展现不同的弹窗。如果是间接通过硬编码的模式管制,通过 if-else 其实也能够解决这个问题,但这会导致代码的耦合,不利于前期的保护和迭代,如果须要减少弹窗,反而还须要一段一段的批改,而通过队列管制,每一个弹窗都是一个函数,是否展现依据每个函数调用的后果来保障,好了咱们来说说具体思路吧!

具体思路和代码

需要:当初有 A、B、C 三个弹窗,须要在 app 首页展现,须要管制它们的展现程序,展现程序是 A——>B——>C… 等,每个弹窗只展现一次。当 A 弹窗展现之后,叉掉 A 弹窗,才会再展现 B 弹窗,以此类推。但也会有一种状况,比方在 app 首页展现了 A,然而用户未操作,间接点击到 app 集体核心,当再次进入首页时,须要展现 B 弹窗,以此类推。

大抵的需要如上,其中还有一些小的细节,在这里就省略了,咱们当初须要来对它进行实现。

let APopShow = getStorage('APopShow')
let BPopShow = getStorage('BPopShow')
let CPopShow = getStorage('CPopShow')
if(!APopShow) {
    AShow = true
    setStorage(!AShow)
    return;
}else if(!BPopShow) {
    BShow = true
    setStorage(!BShow)
    return;
}else if(!CPopShow){
    CShow = true
    setStorage(!CShow)
    return;
}

下面就是一个最繁难的代码了,这个 伪代码 十分的简洁,if - else if - else if ....通过一系列的 if-else 来管制展现的程序。这里会封装为一个专用的弹窗组件,来管制多个弹窗的展现。

应用队列优化

队列能够很好的解决这个问题,防止大量的if-else,队列是先进先出,通过队列管制函数调用,而函数中就是具体的业务逻辑了。咱们这里是用队列的常识,不是齐全照搬队列!!

let Queue = [];
let AShow = false;
let BShow = false;
let CShow = false;

function pushQueue(fnc) {if(fnc instanceof Function){Queue.push(fnc);
    }
}
function runQueue() {for(let fn item Queue) {fn();
    }
}

function AFunc() {};
function BFunc() {if(AShow) return false;};
function CFunc() {if(BShow) return false;};

pushQueue(AFunc);
pushQueue(BFunc);
pushQueue(CFunc);

runQueue();

队列只是负责容许就是了,而具体的业务逻辑,在各自的业务函数中,本人去实现就能够了,咱们在这里做到了肯定水平的代码拆散。当然这只是繁难的代码实现,具体的细节能够调整和优化。

在这里通过队列,对代码进行理解耦,也利于前期来扩大和保护了。以上就是通过队列实现的逻辑了,其实还能够通过订阅公布模式来实现,管制多个弹窗的展现,拆分多个组件,通过全局的状态,同时通过公布订阅,来管制弹窗的展现和程序。大家也能够考虑一下!!

能够解决哪些问题

我的项目中解决的问题:

    1. 管制调用程序,先进先出;
    2. 多个弹窗的执行程序;
    3. 大量申请,缓解服务器申请压力;
    4. 音讯队列;。。。等

调用优先级的问题;管制执行程序;

扩大

有一个需要,在一个事件中须要收回 1w 个申请,是一次性收回 1w 个,还是通过其余形式来进行管制正当呢?留待思考???? 吧!!

退出移动版