點燈坊

學而時習之,不亦悅乎

使用 object_entries() 將 Object 轉成 Array

Sam Xiao's Avatar 2019-11-28

ECMAScript 2017 提供了 Object.entries()Object 的 Static Method,雖然也能搭配 compose() 使用,若能有 Function 版本就更完美了。

Version

macOS Catalina 10.15.1
VS Code 1.40.1
Quokka 1.0.259
Ramda 0.26.1
Wink-fp 1.20.39

entries()

import { compose, reduce } from 'ramda'

let data = {
  a: 'test1',
  c: 'test3',
  b: 'test2'
}

let entries = obj => Object.keys(obj).reduce((a, x) => [...a, [x, obj[x]]], [])

let reducer = reduce((a, [k, v]) => a += k + v, '')

let fn = compose(reducer, entries)

fn(data) // ?

data 為 object,我們希望 object 的所有 key 與 value 能串起來成為單一 string。

由於最後結果為單一 string,因此適合用 reduce(),但我們希望能有另外一個 entries() 將 object 轉成 array,如此才能與 reduce() 組合。

第 9 行

let entries = obj => Object.keys(obj).reduce((a, x) => [...a, [x, obj[x]]], [])

自行使用 Object.keys() 將 key 部分回傳 array,再透過 reduce() 將 object 轉成 array。

entries000

Object.entries()

import { compose, reduce } from 'ramda'

let data = {
  a: 'test1',
  c: 'test3',
  b: 'test2'
}

let reducer = reduce((a, [k, v]) => a += k + v, '')

let fn = compose(reducer, Object.entries)

fn(data) // ?

事實上 ES2017 已經提供 Object.entries(),可直接搭配 compose() 使用。

entries001

Wink-fp

import { compose, reduce } from 'ramda'
import { object_entries as entries} from 'wink-fp'

let data = {
  a: 'test1',
  c: 'test3',
  b: 'test2'
}

let reducer = reduce((a, [k, v]) => a += k + v, '')

let fn = compose(reducer, entries)

fn(data) // ?

Object.entries() 為 static method,雖然勉強能跟 compose() 搭配,但多了 Object 總是美感不佳,畢竟 static method 為 OOP 產物,Wink-fp 將 Object.entries() 封裝成 function,更適合 FP。

因為 ES5 提供了 Array.prototype.entries(),而 Wink-fp 亦提供 array_entries() 將其封裝,由於都是 entries(),因此才取名為 object_entries() 以資區別

entries002

Conclusion

  • object_entries()Object.entries() 的封裝,在 import 時可自行 alias 為 entries(),使用上更為精簡