使用 BehaviorSubject 处理复杂数据的变化答案

【问题标题】：Dealing with changes on complex data with BehaviorSubject使用 BehaviorSubject 处理复杂数据的变化
【发布时间】：2018-09-15 22:24:08
【问题描述】：

假设我有一个服务，它为任何想要获取最新版本数据的组件提供BehaviorSubject。

export class DataService {    
    private messageSource = new BehaviorSubject<Data>(this.data);
    currentMessage = this.messageSource.asObservable();
}

export class Component implements OnInit {

    message:Data;

    constructor(private data: DataService) { }

    ngOnInit() {
      this.data.currentMessage.subscribe(
        message => {
          this.message = JSON.parse(JSON.stringify(message))
        }
      )
    }
}

数据很复杂：

class Data {
    id:number
    prop1:string
    prop2:Array<{prop1:number, prop2:string}>
}

数据随时间变化，组件只关心数据的最新版本。我的问题是：组件在收到通知时如何知道数据的确切更改？

例如，假设prop2 中的一项只有一个字段发生了变化。每个组件都会获得新数据，但他们不知道具体发生了什么变化。了解发生了什么变化将为渲染优化带来许多机会。

BehaviorSubject 有内置的方法吗？组件是否应该在收到通知后找出差异？这通常是怎么做的？

【问题讨论】：

这不是 RxJS 的问题。但是，如果您将主体持有的数据视为不可变的，那么如果您使用 Angular 的 OnPush 更改检测，您将免费获得想要的东西。
@cartant OnPush 似乎很有用，但你的意思是我会免费得到我想要的东西？我还是得看看有什么不同，对吧？
如果您按层次组合组件，使得每条数据都以Input 的形式传递给组件，Angular 将为您完成所有检查。管理变更检测是 Angular 的职责，所以让它为您完成这项工作。

标签： angular typescript rxjs

【解决方案1】：

Subjects 的工作不是关心其有效负载的类型，更不用说关心哪些属性发生了变化。

diff 对象还有其他工具，例如您可能想查看lodash 库中的reduce，它可以满足您的需要。如果您在网络上或在 Stackoverflow 上搜索 deep diff，您会找到有关该问题的更多信息。

关于您的特定问题，您可以将最新的Data 存储在您的组件中，并且每次通过您的主题收到一个新问题时，您区分它使用您选择的工具，应用您的更改并用最新的Data 覆盖存储的Data。

【讨论】：