RxJS 中的 Observable 和 Promise 有什么区别？ - 面试题

核心区别

Observable 和 Promise 都是处理异步操作的工具，但它们在设计理念和使用方式上有显著差异：

1. 执行时机

Promise: 一旦创建就会立即执行，无法取消

javascript
const promise = new Promise((resolve) => {
  console.log('Promise 立即执行');
  resolve('done');
});

Observable: 只有订阅时才会执行，可以取消订阅

javascript
const observable = new Observable((observer) => {
  console.log('Observable 订阅时执行');
  observer.next('data');
});

observable.subscribe();

2. 数据流

Promise: 只能发出一个值，然后完成或失败

javascript
promise.then(value => console.log(value)); // 只接收一个值

Observable: 可以发出多个值，随时间推移持续推送数据

javascript
observable.subscribe(value => console.log(value)); // 可以接收多个值

3. 可取消性

Promise: 无法取消，一旦创建就会执行到底

javascript
const promise = fetch('/api/data');
// 无法中途取消这个请求

Observable: 可以通过 unsubscribe() 取消订阅

javascript
const subscription = observable.subscribe();
subscription.unsubscribe(); // 取消订阅

4. 操作符支持

Promise: 只有链式调用 then/catch/finally

javascript
promise
  .then(data => processData(data))
  .then(result => console.log(result))
  .catch(error => handleError(error));

Observable: 丰富的操作符生态系统

javascript
observable
  .pipe(
    map(data => processData(data)),
    filter(result => result.isValid),
    catchError(error => handleError(error))
  )
  .subscribe();

5. 懒加载 vs 急切加载

Promise: 急切执行，创建时就开始工作 Observable: 懒加载，直到订阅才开始执行

6. 同步/异步

Promise: 总是异步的 Observable: 可以是同步或异步的

实际应用场景

使用 Promise 的场景

单次异步操作
不需要取消
只需要一个结果
简单的异步流程

使用 Observable 的场景

需要处理多个值
需要取消操作
复杂的数据流处理
事件处理
WebSocket 连接
实时数据流

性能考虑

Observable 在处理复杂异步流程时提供了更好的性能和灵活性，特别是在需要处理多个异步操作或需要取消操作的场景中。Promise 更适合简单的异步操作，代码更简洁直观。