Angular使用takeUntil销毁订阅时是否需要调用destroy$.complete()

结论 #

常规场景下不加complete()不会触发明显问题，但该操作不属于多余代码，是更严谨的最佳实践，建议添加。

原因说明 #

• 你观察到的现象是成立的：如果仅将destroy$用于takeUntil操作符，调用next()之后，takeUntil会自动解除对destroy$的订阅，此时destroy$的内部观察者列表确实为空，直接调用complete()不会产生可观测的副作用，看起来是冗余操作。
• 第一个需要添加的理由是规避后续维护风险：如果后续你或项目的其他维护者，在组件内新增了直接订阅destroy$的自定义清理逻辑，没有调用complete()的话，这类订阅会一直残留，甚至组件销毁后如果误触发destroy$的next还会执行异常逻辑。添加complete()后，所有后续订阅都会立刻收到完成信号，不会产生无效订阅。
• 第二个理由是覆盖异步边缘场景：如果存在异步延迟绑定takeUntil的逻辑（比如在某个接口回调里才创建订阅并绑定takeUntil(this.destroy$)），且该回调刚好在ngOnDestroy执行完成后才触发：如果destroy$已经调用过complete()，takeUntil会直接终止新创建的流，不会产生订阅残留；如果仅调用过next()，新的订阅收不到之前发射的next信号，就会一直持有引用造成内存泄漏。
• 第三个理由是符合RxJS的语义规范：所有有明确生命周期终点的Subject，都应该在生命周期结束时发送完成信号，部分自定义操作符或者第三方工具类可能会依赖流的complete事件做资源清理，缺少完成信号可能触发不可预期的问题。

标准写法参考 #

export class FooComponent implements OnDestroy {
  private destroy$ = new Subject<void>();

  ngOnInit() {
    // 示例订阅
    source$.pipe(takeUntil(this.destroy$)).subscribe(...);
  }

  ngOnDestroy() {
    this.destroy$.next();
    this.destroy$.complete();
  }
}

内容的提问来源于stack exchange，提问作者Renaud