[Javascript] Compose multiple functions for new behavior in JavaScript
In this lesson you will create a utility function that allows you to quickly compose behavior of multiple functions to create new behavior. By the end, you will have successfully created a tremendously popular helper function that is used in JavaScript libraries ranging from Redux to Ramda.
const startVal = 4; const squared = x => x * x;
const doubled = x => x * 2;
const addTen = x => x + 10;
const halfNum = x => x / 2; const result = halfNum(addTen(doubled(squared(startVal))));
The code above is not good enough. We can use 'compose' function instead of nested functions call together.
Write 'compose' function:
const compose = (...fns) => initialVal => fns.reduceRight((val, fn) => fn(val), initialVal)
Now we can optimizte the code:
const result = compose(
halfNum,
addTen,
doubled,
squared
)(startVal);
const compose = (...fns) => (...args) => fns.reduceRight((res, fn) => [fn.call(null, ...res)], args)[];
[Javascript] Compose multiple functions for new behavior in JavaScript的更多相关文章
- 45 Useful JavaScript Tips, Tricks and Best Practices(有用的JavaScript技巧,技巧和最佳实践)
As you know, JavaScript is the number one programming language in the world, the language of the web ...
- JavaScript学习笔记(三)——this、原型、javascript面向对象
一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...
- JavaScript学习总结(三)——this、原型、javascript面向对象
一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...
- asp.net中调用javascript自定义函数的方法(包括引入JavaScript文件)总结
通常javascript代码可以与HTML标签一起直接放在前 端页面中,但如果JS代码多的话一方面不利于维护,另一方面也对搜索引擎不友好,因为页面因此而变得臃肿:所以一般有良好开发习惯的程序员都会把 ...
- 常用脚本语言Perl,Python,Ruby,Javascript一 Perl,Python,Ruby,Javascript
常用脚本语言Perl,Python,Ruby,Javascript一 Perl,Python,Ruby,Javascript Javascript现阶段还不适合用来做独立开发,它的天下还是在web应用 ...
- 实践javascript美术馆的小案例,学习到的东西还是蛮多的,包括javascript编程中的预留退路、分离javascript、以及实现向后兼容等
javascript美术馆(改进2) 一.javascript编程过程中的好习惯 1.实现预留退路 js被禁掉,图片也可以显示出来,href属性带有图片路径 <script src=" ...
- 面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统
面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统 原型模式和基于原型继承的JavaScript对象系统 在 Brendan Eich 为 JavaScrip ...
- JavaScript学习笔记 - 进阶篇(6)- JavaScript内置对象
什么是对象 JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法. 对象的属性:反映该对象某些特定的性质的,如:字符串的长度.图像的长宽等: 对象的方法: ...
- JavaScript ES6 Arrow Functions(箭头函数)
1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...
随机推荐
- 【CTO辩论会】移动开发人员忠于技术or 背离技术
第一期CTO辩论会结束后,大家在微信群中讨论,学什么编程语言好.有位官人直呼"劳力者治于人,苦差,不学也罢". 在IT.科技变革世界的今天,移动开发人员成为一个很时髦的工种. 就连 ...
- RISC-V首度被我国列入扶持对象,上海已成RISC-V重要“据点”
时间:2018年7月24日 16:33 摘要:近期,上海市经济信息委发布了<上海市经济信息化委关于开展2018年度第二批上海市软件和集成电路产业发展专项资金(集成电路和电子信息制造领域)项目申报 ...
- matplotlib 可视化 —— 绘制常见图形
0. 饼状图 plt.pie():Python数据可视化:饼状图 1. 三角形 描点连线,起点和终点相同 triangle1 = ((0, sqrt(3)/2), (1, 3*sqrt(3)/2), ...
- vue --- 路由传参的几种方式
方案一: getDescribe(id) { // 直接调用$router.push 实现携带参数的跳转 this.$router.push({ path: `/describe/${id}`, }) ...
- bootstrap如何自定义5列
废话少说,先上代码: <!DOCTYPE html><html> <head> <meta charset="utf-8"> < ...
- c# 的类成员
1 字段和变量的区别 字段是在类中定义的数据成员 由访问修饰符+数据类型+字段名(public string name) 字段就像类的一个小数据库,用来存放和类相关的数据; 而变量是没有修饰符的(in ...
- 位运算与bitset
&运算 将两个数转化为二进制后,对应的位置上相同即取,通常取1,所以&通常情况下可以用来枚举子集 设x为表示集合的整数,那么这个整数有如下性质: x的子集整数y在数值上不会比x大.因 ...
- PHP接收GET中文参数乱码的原因及解决方案
方案1: $str = iconv("gb2312","utf-8",$str); 方案2: mb_convert_encoding($str, "u ...
- 一个Web报表项目的性能分析和优化实践(四):MySQL建立索引,唯一索引和组合索引
先大致介绍下项目的数据库信息. 数据库A:主要存放的通用的表,如User.Project.Report等. 数据库B.C.D:一个项目对应一个数据库,而且这几个项目的表是完全一样的. 数据库表的特点 ...
- 设计模式之九:建造者模式(Builder)
建造者模式: 将一个复杂对象的建造过程和它的表示分离开来,这样同样的建造过程能够创建不同的表示. Separate the construction of a complex object from ...