[Immutable.js] Transforming Immutable Data with Reduce
2016-02-22 03:35
645 查看
Immutable.js iterables offer the reduce() method, a powerful and often misunderstood functional operator on which map(), filter(), groupBy(), etc. are built. The concept is simple: reduce transforms your iterable into something else, that's all. The name is misleading as you may or may not actually "reduce" anything. Let's replicate the groupBy() and filter() methods with reduce to illustrate how it works.
Assume you have a list to todos, each todo with a "completed" prop:
groupBy() like:
filter() like:
Assume you have a list to todos, each todo with a "completed" prop:
groupBy() like:
const todos = Immutable.List([ { id: 1, title: "Immutable.js", completed: true }, { id: 2, title: "RxJS", completed: false }, { id: 3, title: "ReactJS", completed: false } ]); const groupedTodos = todos.reduce( (acc, curr)=>{ let key = curr.completed ? "completed" : "Incompleted"; // Initial value is an Immutable Map object, so use get("completed") to get the Immutable.List(), then push the curr value into it let list = acc.get(key).push(curr); // Immutable return a new list from last push, so we need to set this list to the initial value return acc.set(key, list); }, Immutable.Map({"completed": Immutable.List(), "Incompleted": Immutable.List()})); console.log(groupedTodos.get("Incompleted").get(1).title); //"ReactJS"
filter() like:
// Get all imcompleted todos const filteredTodos = todos.reduce( (acc, curr)=>{ if(!curr.completed){ acc = acc.push(curr); } return acc; }, Immutable.List()); console.log(filteredTodos.get(1).title); // "ReactJS"
相关文章推荐
- 【js】页面刷新
- JavaScript多线程
- HTML5-CSS3-JavaScript(1)
- Python和JavaScript间代码互转的4个工具
- 基于Javascript实现倒计时功能
- JS实现上下左右对称的九九乘法表
- JS字符串的切分用法实例
- Js的Array数组对象详解
- javascript实现一个简单的弹出窗
- 简单谈谈javascript中this的隐式绑定
- JavaScript+html5 canvas实现图片破碎重组动画特效
- JavaScript function函数种类详解
- javascript
- JavaScript奇技淫巧45招
- js-window对象的方法和属性资料
- JavaScript奇技淫巧45招
- js判断字符串出现最多的字符
- JavaScript运算符优先级,逻辑表达式,等于全等于,序列检测小结
- 《JavaScript权威指南》--学习日志
- JavaScript 中的 .prototype