[Javascript] Querying an Immutable.js Map()
2023-09-14 08:59:20 时间
Learn how to query an Immutable.Map() using get, getIn, has, includes, find, first and last. These are powerful operators that make finding data in an object graph pain free.
has, includes, contains:
//has() var map = Immutable.Map({a: '10'}); console.log(map.has("a")); //true //includes / contains var todo = { id: +new Date(), name: "name", content: "content" }; var todo2 = { id: +new Date(), name: "name", content: "content" }; var todos = Immutable.Map(); todos = todos.set(todo.id, todo); console.log(todos.contains(todo)); //true console.log(todos.contains(todo2)); //false
first(), getIn()
// first(), getIn() //Create tow Maps var todos = Immutable.Map(); var todos2 = Immutable.Map(); //Create new Data var todo1 = { id: +new Date(), name: "name", content: "content" }; var todo2 = { id: +new Date()+1000, name: "name", content: "content" }; var todo3 = { id: +new Date()+3000, name: "name", content: "content" }; var todo4 = { id: +new Date()+4000, name: "name", content: "content" }; //Add data to the map todos =todos.set(todo1.id, todo1); todos= todos.set(todo2.id, todo2); todos2=todos2.set(todo3.id, todo3); todos2=todos2.set(todo4.id, todo4); //Wrap maps in another map var multipleTodoStates = Immutable.Map({ "todo1": todos, "todo2": todos2 }); //Get first todo's id in the first map const todoID = todos.first().id; console.log(todoID); //Try to find the first todo in deep map //"todo1" is the first level map //then downto the second level to find the id //If nohting return null var res = multipleTodoStates.getIn(["todo1", todoID], null); var res2 = multipleTodoStates.getIn(["todo2", todoID], null); console.log(res); console.log(res2);
find():
//find() var todo = { id: +new Date(), name: "Wan", content: "Finish it" }; var todos = Immutable.Map(); todos = todos.set(todo.id, todo); var foundTodo = todos.find( (t)=>{ return t.id === todo.id }, null, null) ; console.log(foundTodo.id);
相关文章
- javascript访问html元素的内容(1)
- JS框架_(Typed.js)彩色霓虹灯发光文字动画
- JS框架_(JQuery.js)上传进度条
- JavaScript实现鼠标放上去之后高亮显示且隔行换色
- Win10系列:JavaScript页面导航
- javascript、js操作json对象和字符串互相转换方法
- 详解JavaScript的splice()方法
- [Javascript] Await a JavaScript Promise in an async Function with the await Operator
- [Javascript] Compose multiple functions for new behavior in JavaScript
- QRCode.js:使用 JavaScript 生成二维码
- [Javascript] Broadcaster + Operator + Listener pattern -- 17. Building a Word Matching Game
- [Javascript] JavaScript赋值时的传值与传址
- javascript (js)中的基本概念
- 使用Chrome开发者工具分析JavaScript garbage collector(垃圾回收器)的实现原理
- Atitit.js javascript的rpc框架选型
- js(JavaScript)判断两个数组是否相等
- javascript(js) Uint8Array转普通数组(int数组)数组拼接concat Uint8Array没有concat()方法
- 从零开始学_JavaScript_系列(八)——js系列<2>(事件触发顺序、文本读取、js编写ajax、输入验证、下拉菜单)
- 〖大前端 - 基础入门三大核心之JS篇⑦〗- JavaScript中的数据类型转换
- JavaScript基础&实战 JS中正则表达式的使用
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
- python web py入门(39)- javascript的while循环语句
- web前端框架Javascript开发基础之JavaScript作用域