前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Immutable.js 简记

Immutable.js 简记

作者头像
ACK
发布2020-01-14 16:53:30
1.1K0
发布2020-01-14 16:53:30
举报
文章被收录于专栏:flytam之深入前端技术栈

前言:之前的项目中,在遇到redux的深层嵌套问题时,直接使用深拷贝的库对state进行深拷贝再操作并返回修改后的新的state,一直觉得很不优雅和低效。下一个项目中打算在redux中使用Immutable.js。在此对一些API进行简单记录。日后用到其它也会慢慢补充

Immutable的中文翻译就是不可变,所以。对Immutable对象每一个操作都是返回的一个新的对象。寒假的时候再看看这个库的源码吧, 文档地址

Immutable中的一些数据结构

Map 无序键值对(有点像js的Object)
设置
  • set (对应delete、deleteAll)/ setIn 深层设置数据
代码语言:javascript
复制
//浅层
  • update 更新数据/updateIn 深层更新数据
代码语言:javascript
复制
  • merge\mergeWith 两个Map的合并
代码语言:javascript
复制
mergeWith 可用于解决冲突
  • mergeDeep 深层合并 / mergeDeepWith深层合并手动解决冲突
代码语言:javascript
复制
const one = Map({ a: Map({ x: 10, y: 10 }), b: Map({ x: 20, y: 50 }) })
const two = Map({ a: Map({ x: 2 }), b: Map({ y: 5 }), c: Map({ z: 3 }) })
one.mergeDeep(two)
// Map {
//   "a": Map { "x": 2, "y": 10 },
//   "b": Map { "x": 20, "y": 5 },
//   "c": Map { "z": 3 }
// }
one.mergeDeepWith((oldVal, newVal) => oldVal / newVal, two)
// Map {
//   "a": Map { "x": 5, "y": 10 },
//   "b": Map { "x": 20, "y": 10 },
//   "c": Map { "z": 3 }
// }
  • filter
  • map
  • toJS 深转化js对象
  • toJSON 浅转化js
  • toArray 浅转化
  • toObject 浅转化
读取
  • get/getIn
List 类似于js的数组
OrderedMap 有序键值对(按照设置的顺序?)
Set 无序集合类型
OrderedSet 有序集合,按照添加值顺序排序
Stack 栈 unshift shift
Record 类似于js的Object,but enforces a specific set of allowed string keys, and has default values.
Seq 有效地使用一些高价集合方法(map、filter之类的),不会产生intermediate
Collection 所有集合的基类,键值对入口可以被遍历
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Immutable中的一些数据结构
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档