如何使用 Ramda 更改 Object 的 Property ?
栏目: JavaScript · 发布时间: 6年前
内容简介:實務上由 API 取得的 Array,其 Object 的 Property 不是我們所要的,因此要加以改變,我們會想保留原本 Object 的所有 Property,並且新增 Property 以配合需求,這該如何使用 Ramda 實現呢 ?WebStorm 2018.3.3Quokka 1.0.134
實務上由 API 取得的 Array,其 Object 的 Property 不是我們所要的,因此要加以改變,我們會想保留原本 Object 的所有 Property,並且新增 Property 以配合需求,這該如何使用 Ramda 實現呢 ?
Version
WebStorm 2018.3.3
Quokka 1.0.134
Ramda 0.26.1
Imperative
const data = [
{ name: 'Sam' },
{ name: 'Kevin' },
{ name: 'Mike' },
];
let result = [];
for(let item of data) {
let obj = Object.assign({}, item);
obj['firstName'] = item.name;
result.push(obj);
}
console.log(result);
原本的 array 中的 object,其 property 為 name ,想將其改為 firstName ,並保留原本 name 。
Imperative 會先建立 result array,然後搭配 for loop,使用 Object.assign() 保留原本 object 所有的 property,並直接建立 firstName property,其值為原本的 name ,最後再將新的 object push() 進 result array。
Array.Prototype
const data = [
{ name: 'Sam' },
{ name: 'Kevin' },
{ name: 'Mike' },
];
const result = data.map(x => ({ ...x, firstName: x.name }));
console.log(result);
Array.prototype 內建的 map() 也能達成需求,先透過 ECMAScript 2015 的 ... Spread Operator 保留原本 object 所有 property,再加上新的 firstName ,其值為原本的 x.name 。
ECMAScript 2015 的寫法相當清爽,可讀性也很高。
Ramda
import { map } from 'ramda';
const data = [
{ name: 'Sam' },
{ name: 'Kevin' },
{ name: 'Mike' },
];
const result = map(x => ({...x, firstName: x.name }), data);
console.log(result);
Ramda 亦提供 map() operator,其 callback 部分與 ECMAScript 的 map() 完全一樣,而 Ramda 的 data 在 map() 最後一個參數,因此特別適合使用 Point-free。
import { assoc, chain, map, prop } from 'ramda';
const data = [
{ name: 'Sam' },
{ name: 'Kevin' },
{ name: 'Mike' },
];
const result = map(chain(assoc('firstName'), prop('name')), data);
console.log(result);
map() 的 callback 部分,可在加以簡化。
Ramda 提供了 assoc() operator,除了複製原本 object 的 property 外,還可新增 property。
assoc()
string -> a -> {k: v} -> {k: v}
複製原本 object 的 property 外,還可新增 property
string : 新 propert 的 key
a :新 property 的 value
{k: v} :data 為原 object
{k: v} :回傳的新 object
由於新 property 的 value 要由 prop('name') 提供,由於符合 chain(f, g)(x) === f(g(x), x) 格式,因此可用 chain() 結合 assoc() 與 prop() ,如此 callback 部分也可以 Point-free。
Conclusion
-
Array.prototype.map()的寫法已經相當清爽,可讀性也很高 - Ramda 的
map()寫法與Array.prototyp.map()的寫法也很類似 - Ramda 的
map(),若連 callback 部分也要 Point-free,可以使用chain()搭配assoc()與prop()
Reference
以上所述就是小编给大家介绍的《如何使用 Ramda 更改 Object 的 Property ?》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- MSSQL 使用Change Tracking(更改跟踪)同步数据
- 如何在使用 map() 時只更改少數 Property ?
- java – 无法更改HTTP接受标头 – 使用不同的区域设置解析策略
- reactjs – 使用react-router-dom进行组件渲染时更改Url?
- ruby-on-rails-3 – 使用git更改存储库时出现Capistrano错误
- objective-c – 在ios 5模拟器中使用时如何更改UIPageControl的颜色
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。