内容简介：一直很羨慕 F# 的但這一切終於得到解決，Ramda 擁有豐富的 Operator，且很容易自行開發 Operator 與 Ramda 整合使用。Ramda 0.26.1
一直很羨慕 F# 的 List module 提供了豐富的 Operator，而 ECMAScript 的 Array.prototype 卻只提供有限的 Operator 可用，因此無法完全發揮 FP 威力。
但這一切終於得到解決，Ramda 擁有豐富的 Operator，且很容易自行開發 Operator 與 Ramda 整合使用。
Version
Ramda 0.26.1
Imperative
const books = [
{year: 2016, title: 'functional Programming in JavaScript'},
{year: 2017, title: 'rxJS in Action'},
{year: 2014, title: 'speaking JavaScript'},
];
const titlesForYear = (year, data) => {
const result = [];
for(let i = 0; i < data.length; i++) {
if (data[i].year === year) {
result.push(data[i].title);
}
}
return result;
};
const result = titlesForYear(2016, books);
console.log(result);
很簡單的需求， books array 有各書籍資料，包含 year 與 title ，我們想得到 2016 年份的書籍資料，且只要 書名 即可。
若使用 Imperative 寫法，我們會使用 for loop，先建立要回傳的 result array，由 if 去判斷 2016 年，再將符合條件的 書名 寫入 result array，最後再回傳。
Array.Prototype
const books = [
{year: 2016, title: 'functional Programming in JavaScript'},
{year: 2017, title: 'rxJS in Action'},
{year: 2014, title: 'speaking JavaScript'},
];
const titlesForYear = (data, year) =>
data
.filter(x => x.year === year)
.map(x => x.title);
const result = titlesForYear(books, 2016);
console.log(result);
熟悉 FP 的讀者會很敏感發現，這就是典型 filter() 與 map() 而已，我們可直接使用 ECMAScript 在 Array.prototype 內建的 filter() 與 map() 即可完成需求。
Ramda
import { filter, map, pipe } from 'ramda';
const books = [
{year: 2016, title: 'functional Programming in JavaScript'},
{year: 2017, title: 'rxJS in Action'},
{year: 2014, title: 'speaking JavaScript'},
];
const forYear = year => x => x.year === year;
const onlyTitle = x => x.title;
const titlesForYear = (year, data) =>
pipe(
filter(forYear(year)),
map(onlyTitle),
)(data);
const result = titlesForYear(2016, books);
console.log(result);
Ramda 身為 Functional Library，內建 filter() 與 map() operator 自然不在話下。
我們可先用 pipe() 將 filter() 與 map() 組合 出新的 function，再將 data 傳入。
至於 filter() 與 map() 要傳入的 callback，當然也可以直接使用 Arrow Function，不過在 Ramda 會習慣將 callback 也建立 function，如此可讀性較高。
import { filter, map, compose } from 'ramda';
const books = [
{year: 2016, title: 'functional Programming in JavaScript'},
{year: 2017, title: 'rxJS in Action'},
{year: 2014, title: 'speaking JavaScript'},
];
const forYear = year => x => x.year === year;
const onlyTitle = x => x.title;
const titlesForYear = (year, data) =>
compose(
map(onlyTitle),
filter(forYear(year)),
)(data);
const result = titlesForYear(2016, books);
console.log(result);
pipe() 是 由左向右 ，當然你也可以使用 compose() 為 由右向左 。
至於該用 pipe() 或 compose() 都可以，但本質都是 組合 function，看哪種寫法你的思考較順。
Ramda 風格有個特色：會 組合 小 function 成為 大 function ，所以在 Ramda 幾乎看不到 {} ，最後一個 function 會使用 pipe() 或 compose() 將 小 function 組合起來
User Operator
import { filter, map, pipe } from 'ramda';
const books = [
{year: 2016, title: 'functional Programming in JavaScript'},
{year: 2017, title: 'rxJS in Action'},
{year: 2014, title: 'speaking JavaScript'},
];
const forYear = year => x => x.year === year;
const onlyTitle = x => x.title;
const capitalize = data => map(x => x[0].toUpperCase() + x.slice(1), data);
const titlesForYear = (data, year) =>
pipe(
filter(forYear(year)),
map(onlyTitle),
capitalize,
)(data);
const result = titlesForYear(books, 2016);
console.log(result);
眼尖的讀者會發現結果的 functional Programming in JavaScript 的 f 為小寫，原始的資料就是如此，但 F 為大寫較符合英文閱讀習慣。
因此我們可以自行寫一個 capitalize() operator，將第一個字母變成大寫。
在 Ramda 要成為能夠 pipe() 或 compose() 的 operator 條件很簡單，只要 function 是單一 parameter 即可，且是 Pure Function。
Conclusion
- Ramda 提供了 FP 該有的 operator，不再侷限於
Array.prototype有限的 operator - Ramda 可以很容易的擴充 operator，不再擔心污染
Array.prototype - Ramda 使用
pipe()與compose()，觀念上更接近 FP 的 Compose Function
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持 码农网
猜你喜欢:
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
个性化网页设计与鉴赏
梁景红 / 西安电子科技大学出版社 / 2003-07-14 / 22.00
本书比较全面地介绍了网页设计应注意的相关问题， 在网页设计基础方面着重讲解了网页框架、页面元素、色彩设计，分析了一些人们容易忽视的细小环节，如页面装饰物、图片、文字、连接等。书中结合实例分析了优秀网页的设计创意思想，可以给读者提供一些启示。书中还介绍了作为网页设计者需要了解的信息管理和技术应用，以及网站VI设计和视觉美学等必要知识，读者可针对各种类别的站点具体实践这些知识，寻找进行网页设计的切入点......一起来看看 《个性化网页设计与鉴赏》 这本书的介绍吧!
