[Ramda] Refactor to Point Free Functions with Ramda using compose and converge
In this lesson we'll take some existing code and refactor it using some functions from the Ramda library, most notably, compose
and converge
. When we're done, we'll have taken a function with a couple of local variables and parameter references and converted it into more streamlined "point-free" or "tacit" functions.
For example, we have following function:
const R = require('ramda'); const person = { id: 1, name: 'Joe' }; const generateUrl = (id) => `http://img.soicalnetwork.com/avatar/${id}.png`; const getUpdatedPerson = (person) => { const url = generateUrl(person.id); return R.assoc('avatar', url, person); } const result = getUpdatedPerson(person);
It will add a 'avatar' prop to person object.
We want to refactor the code to make it point free style, we the functions can be more reuseable and easy to understand.
First try:
//=============================================== // #1 Refactoring //=============================================== /* Solve the problem that when id is undefined, we need a default image Solution: propOr('defaultValue', 'prop') */ const generateUrl = (id) => `http://img.soicalnetwork.com/avatar/${id}.png`; const getUpdatedPerson = (person) => { const url = generateUrl(R.propOr('default', 'id')(person)); return R.assoc('avatar', url, person); } const result = getUpdatedPerson(person); console.log(result);
Here we use 'R.propOr', to get prop of an object and set default fallback value. This can help us prevent undefined problem.
Second try:
//=============================================== // #2 Refactoring //=============================================== /** * Extra a single function to get Person url. * Solution: Here we using R.compose. * SO getURLFromPerson is point-free function. */ const generateUrl = (id) => `http://img.soicalnetwork.com/avatar/${id}.png`; const getURLFromPerson = R.compose( generateUrl, R.propOr('default', 'id') ); const getUpdatedPerson = (person) => R.assoc('avatar', getURLFromPerson(person), person); const result = getUpdatedPerson(person); console.log(result);
Here we use 'R.compose' to make 'getURLFromPerson' as a point-free function. Notice in the function, we no longer need to pass 'person' object as a param.
Third try:
//=============================================== // #3 Refactoring //=============================================== /** * In getUpdatedPerson function, we still relay on the 'person' param we pass in. * We want to make it a point-free function also. * Solution: we can use R.converge */ const generateUrl = (id) => `http://img.soicalnetwork.com/avatar/${id}.png`; const getURLFromPerson = R.compose( generateUrl, R.propOr('default', 'id') ); // const getUpdatedPerson = (person) => R.assoc('avatar', getURLFromPerson(person), person); const getUpdatedPerson = R.converge( R.assoc('avatar'), [ getURLFromPerson, R.identity ] ) const result = getUpdatedPerson(person); console.log(result);
The old verson of 'getUpdatedPerson' relay on 'person' param, to make it as point-free function style, we can use another way 'R.converge'.
相关文章
- yum提示Another app is currently holding the yum lock; waiting for it to exit...
- [systemd]How To Use Systemctl to Manage Systemd Services and Units
- The connection to adb is down, and a severe error has occured.分析
- [Angular] Remove divs to Preserve Style and Layout with ng-container in Angular
- [CSSinJS] Convert Sass (SCSS) Styled Button to CSSinJS with JavaScript Templates and Variables
- [Nuxt] Use Vuex Actions to Delete Data from APIs in Nuxt and Vue.js
- [Ramda] Convert a Promise.all Result to an Object with Ramda's zip and zipObj
- UserWarning: XXX is writable by group/others and vulnerable to attack when used with get_resource_filename.
- connection to dat Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2)
- 网络号 = IP和子网掩码的每位数AND 主机号 掩码取反与IP地址and运算
- [CSS] Using single grid-template-area and justify-self to select arrow down icon in select
- [HTML5] Add an SVG Image to a Webpage and Get a Reference to the Internal Elements in JavaScript
- [Tools] Convert SVG to a PDF in Node with PDFKit and SVG.js
- [AngularJS] Store the entry url and redirect to entry url after Logged in
- [Recompose] Refactor React Render Props to Streaming Props with RxJS and Recompose
- [Ramda] Convert a Promise.all Result to an Object with Ramda's zip and zipObj
- [Angular] @ViewChild and template #refs to get Element Ref
- [LeetCode] Best Time to Buy and Sell Stock III
- UserWarning: XXX is writable by group/others and vulnerable to attack when used with get_resource_filename.
- 关于 SAP AMDP 调用错误消息 client-specific and restricts access to a client
- association in CDS view is converted to LEFT OUTER MANY TO ONE JOIN in the runtime
- One Order distribution logic issue - automatic BDOC creation and sent to Middleware outbound queue -
- how to find element's document section
- Failed to find Build Tools revision 24.0.2 Install Build Tools 24.0.2 and sync project
- 成功解决tensorflow.python.framework.errors_impl.UnimplementedError: Cast string to int32 is not supporte
- Introduction to Spring AOP
- Up-to-date cache with EclipseLink and Oracle
- How to Install, Configure and Enable SSH Service in Linux