鍍金池/ 問(wèn)答/HTML/ 不理解這段函數(shù)式編程，看不懂

不理解這段函數(shù)式編程，看不懂

const TOKEN = '123'
const ROOT = '//www.baidu.com'

const root = createAPI => (...args) => {
  const result = createAPI(...args)
  return {...result, url: `${ROOT}${result.url}`}
}

const auth = createAPI => (...args) => {
  const result = createAPI(...args)
  return {
    ...result,
    headers: {...result.headers, authorization: `Bearer ${TOKEN}`},
  }
}

const projects = team => {
  return {
    url: `/api/0/teams/${team}/projects/`,
  }
}

root(auth(projects))('fe')
// 返回值如下
{
   headers: {authorization: "Bearer 123"}
   url: "http://www.baidu.com/api/0/teams/fe/projects/"
}

不理解這段函數(shù)式編程，看不懂,誰(shuí)能詳細(xì)解釋下？

### 你期待的結(jié)果是什么？實(shí)際看到的錯(cuò)誤信息又是什么？
回答
編輯回答
安淺陌

`
const root = function(createAPI){

return function (...args){
    const result = createAPI(...args);
    return {
        ...result,
        url: `${ROOT}${result.url}`;
    }
}

}

`
root 接受一個(gè)函數(shù)A，返回另一個(gè)函數(shù)B，
函數(shù)B的返回結(jié)果是一個(gè)對(duì)象，其中組合了函數(shù)A的返回結(jié)果
auth 同理。

最終參數(shù)是傳到projects然后將返回的對(duì)象進(jìn)行組合

2018年9月3日 13:52
編輯回答
下墜
理解這個(gè)你需要弄明白 ... 操作符的意思，弄明白箭頭函數(shù)的意思
可以把執(zhí)行函數(shù)  root(auth(projects))('fe')  拆成兩部分來(lái)看，都是一些嵌套函數(shù)，把函數(shù)作為參數(shù)共另一個(gè)函數(shù)調(diào)用。


auth(projects)   返回的是 
{
   headers: {authorization: "Bearer 123"}
}

root()('fe') 返回的是 
{
   url: "http://www.baidu.com/api/0/teams/fe/projects/"
}

...操作符把兩次返回的結(jié)果展開(kāi)并組合為一個(gè)新的對(duì)象
2017年2月2日 18:45
編輯回答
只愛(ài)你
  • 函數(shù) root 接受一個(gè)函數(shù) A 并返回一個(gè)函數(shù) B ，函數(shù) B 的函數(shù)體為:
  const result = createAPI(...args)
  return {...result, url: `${ROOT}${result.url}`}

因此，函數(shù) root 的功能是，將傳遞給 B 的所有參數(shù)傳遞給 A 獲得結(jié)果 result，在 result 的基礎(chǔ)上增加一個(gè) url 字段。

  • 函數(shù) auth 的流程與 root 類(lèi)似。
  • 函數(shù) projects 的功能是根據(jù)傳入?yún)?shù)構(gòu)建一個(gè) object，其含有一個(gè) url 字段。

所以整理一下可得：

root(auth(projects))('fe') 中參數(shù) fe 被一路傳遞到 projects 這個(gè)函數(shù)，三層函數(shù)展開(kāi)后的順序是：
projects('fe') | auth | root

  1. 先構(gòu)造基礎(chǔ)數(shù)據(jù)，拼接 url
    projects('fe') >>

    { 
    url: '/api/0/teams/fe/projects/'
}

  2. 在第一步的基礎(chǔ)上增加 headers.authorization 字段
    auth >>

    {
    headers: {
        // ...result.headers 是為了保留在 projects 函數(shù)中定義的 headers（如果有的話(huà)）
        authorization: 'Bearer 123'
    },
    url: '/api/0/teams/fe/projects/'
}

  3. 由 root 修正 url 的前綴
    root >>

    {
   headers: {authorization: "Bearer 123"}
   url: "http://www.baidu.com/api/0/teams/fe/projects/"
}
2017年12月10日 03:06