天天看点

Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析

测试代码:

fromEvent(this.test, 'click').pipe(map( event => event.timeStamp), mapTo(1)).subscribe((event) => console.log(event));
      

pipe 操作的两个输入操作:

Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析
<html>
<script>

var a = [1,2,3,4];

function fn(pre, cur, index, arr){
    console.log(`previous: ${pre}, cur: ${cur},
        index: ${index}, whole arr: ${arr}`);
    return pre + cur;
}

console.log(a.reduce( fn, 0));

</script>
</html>
      

reduce 接受两个参数,第一个参数是一个函数,该函数接收 4 个输入参数,previous,current,index 和 array:

previous:前一轮 reduce 迭代值,如果第一轮,则该值为第二个参数,即初始值

current:当前这轮的 reduce 迭代值。例如,array 元素为1,2,3,4,则 reduce 每轮迭代,current 值分别为1,2,3,4

index:迭代的索引值

array:调用 reduce 的原始数组,配合前一个 index 参数,能访问整个数组的内容

Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析
Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析
Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析

继续阅读