Javascript闭包与函数柯里化浅析


Posted in Javascript onJune 22, 2016

闭包和柯里化都是JavaScript经常用到而且比较高级的技巧,所有的函数式编程语言都支持这两个概念,因此,我们想要充分发挥出JavaScript中的函数式编程特征,就需要深入的了解这两个概念,闭包事实上更是柯里化所不可缺少的基础。

一、柯里化的概念

在计算机科学中,柯里化是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数且返回结果的新函数的技术。这个技术由Christopher Strachey以逻辑学家 Haskell Curry 命名的,尽管它是 Moses Schnfinkel 和 Gottlob Frege 发明的。在直觉上,柯里化声称“如果你固定某些参数,你将得到接受余下参数的一个函数”。所以对于有两个变量的函数yx,如果固定了y = 2,则得到有一个变量的函数2x。

柯里化就是预先将函数的某些参数传入,得到一个简单的函数。但是预先传入的参数被保存在闭包中,因此会有一些奇特的特性。比如:

var adder = function(num){
  return function(y){
     return num + y;
  }
}
var inc = adder(1);
var dec = adder(-1)

这里的inc/dec两个变量事实上是两个新的函数,可以通过括号来调用,比如下例中的用法:

//inc, dec现在是两个新的函数,作用是将传入的参数值(+/-)1
print(inc(99));//100
print(dec(101));//100
print(adder(100)(2));//102
print(adder(2)(100));//102

二、柯里化的应用

根据柯里化的特性,我们可以写出更有意思的代码,比如在前端开发中经常会遇到这样的情况,当请求从服务端返回后,我们需要更新一些特定的页面元素,也就是局部刷新的概念。使用局部刷新非常简单,但是代码很容易写成一团乱麻。而如果使用柯里化,则可以很大程度上美化我们的代码,使之更容易维护。我们来看一个例子:

//update会返回一个函数,这个函数可以设置id属性为item的web元素的内容
function update(item){
  return function(text){
     $("div#"+item).html(text);
  }
}
//Ajax请求,当成功是调用参数callback
function refresh(url, callback){
  var params = {
     type : "echo",
     data : ""
  };
  $.ajax({
     type:"post",
     url:url,
     cache:false,
     async:true,
     dataType:"json",
     data:params,
     //当异步请求成功时调用
     success: function(data, status){
        callback(data);
     },
     //当请求出现错误时调用
     error: function(err){
        alert("error : "+err);
     }
  });
}
refresh("action.do?target=news", update("newsPanel"));
refresh("action.do?target=articles", update("articlePanel"));
refresh("action.do?target=pictures", update("picturePanel"));
其中,update函数即为柯里化的一个实例,它会返回一个函数,即:
update("newsPanel") = function(text){
  $("div#newsPanel").html(text);
}

由于update(“newsPanel”)的返回值为一个函数,需要的参数为一个字符串,因此在refresh的Ajax调用中,当success时,会给callback传入服务器端返回的数据信息,从而实现newsPanel面板的刷新,其他的文章面板articlePanel,图片面板picturePanel的刷新均采取这种方式,这样,代码的可读性,可维护性均得到了提高。

以上就是本文的全部内容,了解更多JavaScript的语法,大家可以查看:《JavaScript 参考教程》、《JavaScript代码风格指南》,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery EasyUI API 中文文档 - NumberSpinner数值微调器使用介绍
Oct 21 Javascript
浅析JavaScript中的CSS属性及命名规范
Nov 28 Javascript
js和jquery如何获取图片真实的宽度和高度
Sep 28 Javascript
jquery正则表达式验证(手机号、身份证号、中文名称)
Dec 31 Javascript
js学习阶段总结(必看篇)
Jun 16 Javascript
浅谈angularjs依赖服务注入写法的注意点
Apr 24 Javascript
JavaScript生成简单等差数列
Nov 28 Javascript
vue项目中公用footer组件底部位置的适配问题
May 10 Javascript
解决修复npm安装全局模块权限的问题
May 17 Javascript
vue父组件异步获取数据传给子组件的方法
Jul 26 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
Jul 19 Javascript
javascript设计模式 ? 外观模式原理与用法实例分析
Apr 15 Javascript
JS中innerHTML和pasteHTML的区别实例分析
Jun 22 #Javascript
JS实现pasteHTML兼容ie,firefox,chrome的方法
Jun 22 #Javascript
浅析JavaScript中命名空间namespace模式
Jun 22 #Javascript
Javascript实现图片不间断滚动的代码
Jun 22 #Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 #Javascript
jQuery实现指定区域外单击关闭指定层的方法【经典】
Jun 22 #Javascript
Javascript 5种方法实现过滤删除前后所有空格
Jun 22 #Javascript
You might like
基于数据库的在线人数,日访问量等统计
2006/10/09 PHP
洪恩在线成语词典小偷程序php版
2012/04/20 PHP
PHP自定义函数实现assign()数组分配到模板及extract()变量分配到模板功能示例
2018/05/23 PHP
HTML中事件触发列表与解说
2007/07/09 Javascript
检测input每次的输入是否合法遇到汉字输入就有问题
2012/05/23 Javascript
zTree插件之单选下拉菜单实例代码
2013/11/07 Javascript
JS二维数组的定义说明
2014/03/03 Javascript
浅谈angularJS 作用域
2015/07/05 Javascript
JS实现点击上移下移LI行数据的方法
2015/08/05 Javascript
bootstrap datetimepicker日期插件使用方法
2017/01/13 Javascript
js仿淘宝评价评分功能
2017/02/28 Javascript
详解微信小程序设置底部导航栏目方法
2017/06/29 Javascript
解决linux下node.js全局模块找不到的问题
2018/05/15 Javascript
vue组件name的作用小结
2018/05/23 Javascript
Vue.js中使用iView日期选择器并设置开始时间结束时间校验功能
2018/08/12 Javascript
解决JavaScript layui 下拉框不显示的问题
2018/08/14 Javascript
jQuery实现的模仿雨滴下落动画效果
2018/12/11 jQuery
微信小程序 wx:for 与 wx:for-items 与 wx:key的正确用法
2020/05/19 Javascript
[01:56]2014DOTA2西雅图邀请赛 MVP外卡赛老队长精辟点评
2014/07/09 DOTA
Python3.5编程实现修改IIS WEB.CONFIG的方法示例
2017/08/18 Python
python3 实现调用串口功能
2019/12/26 Python
python GUI编程(Tkinter) 创建子窗口及在窗口上用图片绘图实例
2020/03/04 Python
Jupyter Notebook折叠输出的内容实例
2020/04/22 Python
前端面试必备之CSS3的新特性
2017/09/05 HTML / CSS
经理管理专业自荐信范文
2013/12/31 职场文书
收银员岗位职责
2014/02/07 职场文书
元宵节主持词
2014/03/25 职场文书
给孩子的新年寄语
2014/04/08 职场文书
3分钟英语演讲稿
2014/04/29 职场文书
施工质量承诺书范文
2014/05/30 职场文书
党员证明模板
2015/06/19 职场文书
高老头读书笔记
2015/06/30 职场文书
CSS中em的正确打开方式详解
2021/04/08 HTML / CSS
Oracle 数据仓库ETL技术之多表插入语句的示例详解
2021/04/12 Oracle
完美解决golang go get私有仓库的问题
2021/05/05 Golang
Spring Data JPA框架自定义Repository接口
2022/04/28 Java/Android