點燈坊

學而時習之,不亦悅乎

使用 assocPath() 新增多層 Property

Sam Xiao's Avatar 2019-08-04

若新增 Property 只有一層,則 assoc() 適用;若新增 Property 有多層,則要使用 assocPath()

Version

macOS 10.14.5
VS Code 1.36.1
Quokka 1.0.238
Ramda 0.26.1

Object

Existing Property

import { assocPath } from 'ramda';

let data = {
  title: 'FP in JavaScript',
  price: {
    US: 100,
    China: 700
  }
};

console.dir(assocPath(['price', 'China'], 694)(data));

assocPath() 可直接修改既有 property。

assocPath()
[String] -> a -> {a} -> {a}

[String]:多層 property 的 key 以 array 傳入

a:property 的 value

{a}:data 為 object

{a}:回傳新 object

path000

New Property

import { assocPath } from 'ramda';

let data = {
  title: 'FP in JavaScript',
  price: {
      US: 100,
      China: 700
    }
};

console.dir(assocPath(['price', 'Taiwan'], 3100)(data));

若 property 不存在,assocPath() 將新增 property。

path001

Array

Existing Element

import { assocPath } from 'ramda';

let data = [
  'FP in JavaScript',
  [100, 700]
];

assocPath([1, 1], 694)(data); // ?

由於 object 與 array 的曖昧關係,assocPath() 也能用在 nested array。

assocPath()
[Int] -> a -> [a] -> [a]

[Int]:nested array 的 index 以 array 傳入

a:element 的 value

[a]:data 為 array

[a]:回傳新 array

path002

New Element

import { assocPath } from 'ramda';

let data = [
  'FP in JavaScript',
  [100, 700]
];

assocPath([1, 2], 3100)(data); // ?

若 index 不存在,assocPath() 將新增 element。

path003

Conclusion

  • 因為 ECMAScript 的 object 與 array 的曖昧關係,導致 assocPath() 也能用在 array

Reference

Ramda, assocPath()