https://www.educative.io/courses/functional-programming-patterns-with-ramdajs/m7wP8OjrvxA

const bobo = {
  firstName: 'Bobo',
  lastName: 'Flakes'
};
const result = upperAndReverseFirstName(bobo);
console.log({ result });
//{ result: 'OBOB' }

const getFirstName = (user) => user.firstName;
const uppercaseString = (string) => string.toUpperCase();
const reverseString = (string) => string
  .split('')
  .reverse()
  .join('');
const upperAndReverseFirstName = (user) => {
  const name = getFirstName(user);
  const uppercasedName = uppercaseString(name);
  return reverseString(uppercasedName);
};

const users = [{
  firstName: 'Bobo',
  lastName: 'Flakes'
}, {
  firstName: 'Lawrence',
  lastName: 'Shilling'
}, {
  firstName: 'Anon',
  lastName: 'User'
}];
// ['OBOB', 'ECNERWAL', 'NONA']

const getFirstName = (user) => user.firstName;
const uppercaseString = (string) => string.toUpperCase();
const reverseString = (string) => string
  .split('')
  .reverse()
  .join('');
const upperAndReverseFirstName = (user) => {
  const name = getFirstName(user);
  const uppercasedName = uppercaseString(name);
  return reverseString(uppercasedName);
};
const upperAndReverseFirstNames = (users) => {
  return users.map(upperAndReverseFirstName);
}

链式调用

Since all three steps deal with a string, we can use method chaining:

const upperAndReverseFirstName = (user) => {
  return user.firstName
    .toUpperCase()
    .split('')
    .reverse()
    .join('');
};
const result = upperAndReverseFirstName({
  firstName: 'Bobo'
});
console.log({ result });

This solution’s a good example of composition and works fine.
It’s a bit limited, however.
We’d likely find uppercasing and reversing strings useful somewhere else in our app! How can we better share that functionality?

分解组合

Breaking It Up #

Our steps can lead to three functions instead:

1. getFirstName
2. uppercaseString
3. reverseString ```javascript const getFirstName = (user) => user.firstName; const uppercaseString = (string) => string.toUpperCase(); const reverseString = (string) => string .split(‘’) .reverse() .join(‘’);

const upperAndReverseFirstName = (user) => { const name = getFirstName(user); const uppercasedName = uppercaseString(name);

return reverseString(uppercasedName); };

const result = upperAndReverseFirstName({ firstName: ‘Bobo’ });

console.log({ result });

Now we have upperAndReverseFirstName and all the pieces it’s composed of. Any other function can import the piece it needs, without hauling in everything else.<br />And if the requirements of a step change, we can just change the function responsible for that step without breaking the chain.
```javascript
const upperAndReverseFirstNames = (users) => {
  return users.map(upperAndReverseFirstName);
};

使用Ramda

//users.json
[
  {
    "firstName": "Bobo",
    "lastName": "Flakes"
  },
  {
    "firstName": "Lawrence",
    "lastName": "Shilling"
  },
  {
    "firstName": "Anon",
    "lastName": "User"
  }
]

const upperAndReverseFirstNames = (users) => {
  return users.map(upperAndReverseFirstName);
};
import { map } from 'ramda';
import users from './users.json';
const result = map(upperAndReverseFirstName, users);
console.log({ result });

Not much. In fact, it’s more complicated because we’re importing map instead of just using the built-in array method.
But here’s something Array.map can’t do…

万物柯里化 预加载函数

Curried functions can take some parameters now, and others later by returning a function.

import { map } from 'ramda';
import users from './users.json';
const upperAndReverseFirstNames = map(upperAndReverseFirstName);
const result = upperAndReverseFirstNames(users);
console.log({ result });

无值函数 更短（声明式+高阶函数+柯里化+不需要规定参数值+过程和值无关） Point-Free

Also, notice that the mention of a user parameter has been eliminated. Those two functions don’t explicitly say the data they’re operating on. We’ve given them pretty good variable names so we know exactly what’s happening, but do you see any parameters being specified?
This is a style enabled by HOFs and currying called point-free and it can be beautiful.

Point-free functions don’t show their arguments, making them even briefer than their pointed counterparts. This is nice and short

因为无需参数 所以更简短 更好

const upperAndReverseFirstNames = (users) => {
  return users.map(upperAndReverseFirstName);
};

const upperAndReverseFirstNames = map(upperAndReverseFirstName);

数据最后 Data Last （声明式+无值）

Ramda’s functions take their data last, making point-free as easy as possible.

The last gem to gaze at is the ordering of map’s arguments. See how the users are supplied after the mapping function?

// users come first
users.map(upperAndReverseFirstName);
// users come last
map(upperAndReverseFirstName, users)

By design Ramda’s functions are curried and take the data last, allowing for the best point-free, declarative JavaScript possible.
You can combine functions until you’re ready for liftoff. Then when the data finally arrives, watch your pipeline soar like a rocket.