take实现原理
<html><head></head><body><div id="test">qwe</div><script>let $btn = document.getElementById("test");//channel是对事件源的抽象，作用是先注册一个take方法，当put触发时，执行一次take方法，然后销毁他。function channel() {let taker;// take 负责往任务队列 里面添加任务监听 function take(cb) { taker = cb;}// put 负责触发给任务流中的next 传参 触发相应的监听function put(input) {if (taker) {const tempTaker = taker;taker = null;//tempTaker 就是下面的 runTakeEffect 中传进来的next 方法 把put 进来的action传进去tempTaker(input);}}return{put,// 发布者take, // 订阅者};}const chan = channel();function take() {return {type: 'take'};}//创建任务队列function* mainSaga() {const action = yield take();const actions = yield take();}function runTakeEffect(effect, cb) {chan.take(input => {cb(input);});}// Thunk 函数的自动流程管理 对应 从 generator 函数 到 redux -saga （二） 中的相应部分function task(iterator) {const iter = iterator();function next(args) {const result = iter.next(args);if (!result.done) {const effect = result.value;if (effect.type === 'take') {runTakeEffect(result.value, next);}}}next();}task(mainSaga);let i = 0;$btn.addEventListener('click', async() => {const action =`action data${i++}`;chan.put(action);}, false); </script></body>
</html>