Rxjs条件延迟实现：根据Observable值决定是否执行延迟

嘿，这个需求用RxJS的delayWhen操作符就能完美搞定，它专门设计用来根据源Observable发出的值来动态决定延迟时长（甚至直接跳过延迟）。

第一种实现方式（直观易懂） #

import { of } from 'rxjs';
import { delayWhen, delay } from 'rxjs/operators';

// 替换成你的布尔值变量
const someBool = true;

of(someBool).pipe(
  delayWhen(value => {
    // 核心逻辑：值为true时延迟1秒，否则立即发出
    return value ? of(null).pipe(delay(1000)) : of(null);
  })
).subscribe(() => {
  console.log("操作执行完成！");
});

更简洁的写法（利用timer） #

如果想让代码更紧凑，可以用timer操作符——timer(0)会立即发出值，timer(1000)会延迟1秒发出，刚好适配delayWhen的要求：

import { of, timer } from 'rxjs';
import { delayWhen } from 'rxjs/operators';

const someBool = false;

of(someBool).pipe(
  delayWhen(value => timer(value ? 1000 : 0))
).subscribe(() => {
  console.log("操作执行完成！");
});

原理说明 #

• delayWhen接收一个回调函数，这个函数会拿到源Observable发出的每一个值
• 回调函数需要返回一个控制延迟的Observable：当这个Observable发出值时，源Observable的值就会被推送给订阅者
• 所以我们只需要根据someBool的值，返回对应延迟时长的Observable即可——不需要延迟就返回立即发出值的Observable，需要延迟就返回带时长的延迟Observable

内容的提问来源于stack exchange，提问作者Hikmat G.