Currying is a core concept of functional programming and a useful tool for any developer's toolbelt.

Example 1:

let f = a => b => c => a+b+c;

let result = f(1)(2)(3);
console.log(result); //

Example 2:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.18.0/ramda.min.js"></script>
</head>
<body>
<div id="one" style="width: 100px;height: 100px;border: 2px solid black">One</div>
<div id="two" style="width: 100px;height: 100px;border: 2px solid black">Two</div>
<div id="three" style="width: 100px;height: 100px;border: 2px solid black">Three</div>
</body>
</html>
let one = document.getElementById('one');
let tow = document.getElementById('two');
let three = document.getElementById('three'); let f = a => b => c => a.addEventListener(b, (event)=>{
event.target.style.background = c;
}); f(one)('click')('red');

Example 3:

let one = document.getElementById('one');
let tow = document.getElementById('two');
let three = document.getElementById('three'); let f = a => b => c => a.addEventListener(b, (event)=>{
event.target.style.background = c;
}); let oneClickEvent = f(one);
let twoClickEvent = f(two); oneClickEvent('mouseover')('red');
twoClickEvent('mouseout')('blue');

Example 4: include ramda library:

let one = document.getElementById('one');
let tow = document.getElementById('two');
let three = document.getElementById('three'); let f = R.curry((a,b,c) =>{
a.addEventListener(b, (event)=>{
event.target.style.background = c;
});
}); // with placeholder from Ramda
const clickGreen = f(R.__, 'click', 'green');
clickGreen(one);

Example 5: multi placeholders:

let one = document.getElementById('one');
let tow = document.getElementById('two');
let three = document.getElementById('three'); let f = R.curry((a,b,c) =>{
a.addEventListener(b, (event)=>{
event.target.style.background = c;
});
}); // with placeholder from Ramda
const clickColor = f(R.__, 'click', R.__);
clickColor(one, 'yellow');
clickColor(two, 'grey');
clickColor(three, 'pink');

[Javascript] What is JavaScript Function Currying?的更多相关文章

  1. Function Currying in javascript 的一些注释

    理解函数柯里化(Function Currying ),最关键的是理解下面这个函数: function curry(fn){ var args = Array.prototype.slice.call ...

  2. Javascript学习之函数(function)

    在JS中,Function(函数)类型实际上是对象;每个函数都是Function类型的实例,而且都与其他引用类型一样具有属性和方法.由于函数是对象,因此函数名实际上也是一个指向函数对象的指针. 一 函 ...

  3. JavaScript自运行函数(function(){})()的理解

    今天打开JQuery源文件(jquery-1.8.3), 看到JQuery的初始化过程是这样的 (function( window, undefined ) { // .... })( window ...

  4. javascript对象模型和function对象

    javascript中,函数就是对象 <html> <head> <script type="text/javascript"> functio ...

  5. JavaScript高级篇之Function对象

    JavaScript高级篇之Function对象 一: Function对象引入: Function对象是js的方法对象,可以用Function实例化出任何js方法对象. 例如: <%@ pag ...

  6. jsp中的javascript的$(document).ready( function() { $("#loginForm").validate()

    转自:https://bbs.csdn.net/topics/392459787?list=71147533 下面是jsp页面中的JavaScript代码 $(document).ready( fun ...

  7. JavaScript权威设计--JavaScript函数(简要学习笔记十一)

    1.函数调用的四种方式 第三种:构造函数调用 如果构造函数调用在圆括号内包含一组实参列表,先计算这些实参表达式,然后传入函数内.这和函数调用和方法调用是一致的.但如果构造函数没有形参,JavaScri ...

  8. JavaScript权威设计--JavaScript函数(简要学习笔记十)

    1.函数命名规范 函数命名通常以动词为前缀的词组.通常第一个字符小写.当包含多个单词时,一种约定是将单词以下划线分割,就像"like_Zqz()". 还有一种就是"lik ...

  9. javascript笔记:javascript的关键所在---作用域链

    javascript里的作用域是理解javascript语言的关键所在,正确使用作用域原理才能写出高效的javascript代码,很多javascript技巧也是围绕作用域进行的,今天我要总结一下关于 ...

  10. JavaScript学习13 JavaScript中的继承

    JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript"> //继承第一种方式 ...

随机推荐

  1. sql - sum() 和 count() 函数的区别

    对sql一直都是蜻蜓点水,突然也觉得对这两个函数的区别有点朦胧,查了一下,在这里说一下: sum():主要用于累加求和. count():主要用于行(记录)的统计.

  2. tomcat报404

    很久没有用eclipse了,尝试了使用下,竟然将简单的配置tomcat都忘了. 自己新建一个工程,在tomcat发布以后,报404,经查Serves下的web.xml中,欢迎页面是index.jsp, ...

  3. UIScrollView设置了contentSize后还是没办法滚动?

    1.最常见的原因是 contentSize 这个属性,比uiscrollview的frame要小, 无需滚动, 自然就滚动不了. scrollenabled 这个属性,标识着是否允许滚动,要言设成ye ...

  4. 数据类型的转换String

    x.toString(): 无法转换null和undefined 不过String()却是万能的,其中的原理如下 function String(x){ if(x===undefined){ retu ...

  5. vs2012快捷键

    (1)自己整理的使用频率最高的快捷键(建议大家亲身体验一下!这样才会在潜移默化中运用得到!) (这里省去了很多大家闭上眼都会操作的什么Ctrl+S 等等操作 给出的大多是不常用但是很有用的快捷键组合! ...

  6. Java笔试知识总结(第一回)

  7. System.InvalidOperationException: 无法加载协定为“ServiceReference1.XXXXXXXXXXXXXXXX”的终结点配置部分,因为找到了该协定的多个终结点配置。请按名称指示首选的终结点配置部分。

    <system.serviceModel> <bindings> <basicHttpBinding> <binding name="testWeb ...

  8. JQUERY1.9学习笔记 之内容过滤器(三) has选择器

    描述:选择至少包含一个元素,匹配指定的标签的标签.jQuery( ":has(selector)" ) 例:给所有的div添加一个类"test",在他们中有一个 ...

  9. 给AVS添加描述(how to add a description to a video)

    UPDATE you might need edit few files. 1. add the input field to the tpl file: /templates/frontend/yo ...

  10. 创建组合索引SQL从1个多小时到1S的案例

    select aa.acct_org, aa.loan_acct_no, aa.FUNCTIONARY, aa.cust_no, sum(dwm.pkg_tools.currcdtran(bb.INT ...