18、深入理解 Flux 架构中的不可变数据

m0n1o2p

于 2025-11-12 12:47:34 发布

阅读量8

点赞数

CC 4.0 BY-SA版权

分类专栏：深入浅出Flux架构文章标签： Flux架构不可变数据 Immutable.js

本文链接：https://blog.youkuaiyun.com/m0n1o2p/article/details/155083238

深入浅出Flux架构专栏收录该内容

27 篇文章 ¥499.90

订阅专栏¥69.90

会员秒杀 ¥9.9 重磅福利

超级会员免费看

深入理解 Flux 架构中的不可变数据

1. 不可变数据的引入与问题

在 Flux 架构中，不可变数据为单向数据流提供了一定程度的保障，但同时也带来了成本。例如，以下代码展示了尝试修改冻结对象属性时的错误：

try {
  frozenState.third = 3;
} catch (err) {
  console.error(err);
  // →
  // TypeError: Can't add property third, object is
  // not extensible
}

当 change 事件触发时，不同方式处理状态数据会有不同表现：

copy.on('change', (state) => {
  console.assert(state !== copyState, 'copy same');
  console.assert(state.fourth, 'copy missing fourth');
});
constant.on('change', (state) => {
  console.assert(state !== constantState, 'constant same');
  // → Assertion failed: constant same
  console.assert(state.fourth, 'constant missing fourth');
});
frozen.on('change',