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的更多相关文章

  1. 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 ...

  2. JavaScript学习笔记(三)——this、原型、javascript面向对象

    一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...

  3. JavaScript学习总结(三)——this、原型、javascript面向对象

    一.this 在JavaScript中this表示:谁调用它,this就是谁. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是一个动态的对象,根据调用的对象不同而发生变化, ...

  4. asp.net中调用javascript自定义函数的方法(包括引入JavaScript文件)总结

    通常javascript代码可以与HTML标签一起直接放在前 端页面中,但如果JS代码多的话一方面不利于维护,另一方面也对搜索引擎不友好,因为页面因此而变得臃肿:所以一般有良好开发习惯的程序员都会把 ...

  5. 常用脚本语言Perl,Python,Ruby,Javascript一 Perl,Python,Ruby,Javascript

    常用脚本语言Perl,Python,Ruby,Javascript一 Perl,Python,Ruby,Javascript Javascript现阶段还不适合用来做独立开发,它的天下还是在web应用 ...

  6. 实践javascript美术馆的小案例,学习到的东西还是蛮多的,包括javascript编程中的预留退路、分离javascript、以及实现向后兼容等

    javascript美术馆(改进2) 一.javascript编程过程中的好习惯 1.实现预留退路 js被禁掉,图片也可以显示出来,href属性带有图片路径 <script src=" ...

  7. 面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统

    面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统 原型模式和基于原型继承的JavaScript对象系统 在 Brendan Eich 为 JavaScrip ...

  8. JavaScript学习笔记 - 进阶篇(6)- JavaScript内置对象

    什么是对象 JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法. 对象的属性:反映该对象某些特定的性质的,如:字符串的长度.图像的长宽等: 对象的方法: ...

  9. JavaScript ES6 Arrow Functions(箭头函数)

    1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...

随机推荐

  1. pycharm第一个Python程序

    print ("Hello word!"); 这是Python3.xx的语法!

  2. DDos游戏行业受攻击最多

    游戏行业遭遇DDOS攻击现状. 游戏一直是最易遭受黑客攻击的行业,高居全年DDOS攻击的48%.大规模攻击居多,平均值均超过100Gbps,攻击峰值急速上升,同比2015年增加了137.1%,其中攻击 ...

  3. django uWSGI nginx搭建一个web服务器 确定可用

    网上的找了很多篇 不知道为什么不行,于是自己搭建了一个可用的Web 大家可按步骤尝试 总结下基于uwsgi+Nginx下django项目生产环境的部署 准备条件: .确保有一个能够用runserver ...

  4. 集合区别(list和linkedlist的区别)?

    1.list和linkedlist都是有序可重复,为什么还要用linkedlist呢? 数组和数组列表都有一个重大的缺陷,这就是从数组的中间位置删除一个元素需要付出很大的代价,其原因是数组中处于被删除 ...

  5. Java类和对象11

    首先,编写一个类ChongZai,该类中有3个重载的方法void print():其次,再编写一个主类来测试ChongZai类的功能. public class ChongZai { public v ...

  6. 针对发起alter tablespace test begin backup 断电情况的处理

    SQL> select tablespace_name from dba_tablespaces; TABLESPACE_NAME ------------------------------ ...

  7. html中隐藏一个元素的方法

    display:none;                                                      隐藏不占位 opacity:0; fliter:alpha(opa ...

  8. VS自定义开发向导中的vsdir文件的简单说明

    作者:朱金灿 来源:http://blog.csdn.net/clever101 VS自定义开发向导中有一个vsdir文件.这个文件指定了在VS中项目的标题.默认工程名等内容.下面对vsdir文件做一 ...

  9. 离奇失踪的WM_HOTKEY消息--浅析WIN32消息队列

    故事的开端有些平淡,眼红于XXX小程序,认为写完该程序就有了和心仪的妹子多相处的机会,必须搞,必须酷,按钮不能有,界面得隐藏,这就想到了全局快捷键. 注册调用RegisterHotKey(m_hWnd ...

  10. 《剑指offer》字符串中的字符替换

    一.题目描述 请实现一个函数,将一个字符串中的空格替换成"%20".例如,当字符串为We Are Happy.则经过替换之后的字符串为We%20Are%20Happy. 二.输入描 ...