RxJS字符串导入与命名导入的区别及判断方法咨询

这问题问得太到位了！RxJS早期版本（主要是v5及之前）的两种导入方式确实容易让人懵，我来给你拆解清楚它们的核心区别，以及怎么快速判断该用哪种：

一、两种导入方式的核心差异 #

1. 字符串导入（比如 import 'rxjs/add/operator/map'） #

• 本质是原型链扩展：导入后会把map这类操作符直接挂载到Observable的原型上，所以你能直接在任何Observable实例上链式调用，比如：

  import 'rxjs/add/operator/map';
  of(1,2,3).map(x => x * 2); // 直接调用实例方法
  

• 弊端很明显：会污染全局的Observable原型，而且如果不小心导入了很多这类扩展，打包时容易引入冗余代码，导致包体积膨胀。
• 这是RxJS v5及更早版本的主流写法，但在v6之后被官方废弃，转而推荐pipeable操作符。

2. 命名导入（比如 import { merge } from 'rxjs/observable/merge'） #

• 本质是按需导入独立模块：你拿到的是一个独立的函数/操作符，需要直接调用或者通过管道组合使用：
  • 对于静态创建方法（比如merge、of）：直接调用即可

    import { merge, of } from 'rxjs';
    const obs1 = of(1);
    const obs2 = of(2);
    merge(obs1, obs2);
    

  • 对于操作符（v6+的pipeable版本）：需要放到pipe()方法里组合

    import { of } from 'rxjs';
    import { map } from 'rxjs/operators';
    of(1,2,3).pipe(map(x => x * 2));
    

• 优势突出：不会污染原型，打包工具能更好地做Tree Shaking，只打包你实际用到的代码，大幅减小包体积。这也是RxJS v6及之后官方强推的导入方式。

二、为什么有些方法只支持一种导入方式？ #

• 早期RxJS的设计历史问题：部分老操作符最初只实现了原型扩展版本，而像merge这类创建型静态方法本身就是独立函数，从设计上就只能用命名导入。
• 版本迭代的影响：RxJS v6彻底重构了操作符体系，把所有实例操作符都改成了pipeable的命名导入方式，原型扩展的写法被废弃，所以在v6+里你只能用命名导入。

三、快速判断导入方式的方法 #

1. 先看你的RxJS版本
   • v6及以上：无脑用命名导入。创建方法从rxjs导入，操作符从rxjs/operators导入，然后用pipe()组合。
   • v5及以下：静态创建方法用命名导入；实例操作符可以选原型扩展导入，或者用v5后期引入的lettable操作符（类似v6的pipeable，从rxjs/operators导入后用.let()调用）。
2. 再看方法的类型
   • 如果是创建Observable的静态方法（比如merge、forkJoin、from）：必须用命名导入，因为它们是独立函数，不是实例方法。
   • 如果是Observable实例的操作符（比如map、switchMap）：v5可选原型扩展，v6+必须用pipeable命名导入。
3. 查官方文档
   最稳妥的方式是查RxJS官方文档，每个方法的页面都会直接给出对应的导入代码示例，照着抄就不会出错。

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