使用 JavaScript 进行函数式编程 (一) 翻译


Posted in Javascript onOctober 02, 2015

编程范式

编程范式是一个由思考问题以及实现问题愿景的工具组成的框架。很多现代语言都是聚范式(或者说多重范式): 他们支持很多不同的编程范式,比如面向对象,元程序设计,泛函,面向过程,等等。

使用 JavaScript 进行函数式编程 (一) 翻译

函数式编程范式

函数式编程就像一辆氢燃料驱动的汽车——先进的未来派,但是还没有被广泛推广。与命令式编程相反,他由一系列语句组成,这些语句用于更新执行时的全局状态。函数式编程将计算转化作表达式求值。这些表达式全由纯数学函数组成,这些数学函数都是一流的(可以被当做一般值来运用和处理),并且没有副作用。

使用 JavaScript 进行函数式编程 (一) 翻译

函数式编程很重视以下值:

函数是一等要务

我们应该将函数与编程语言中的其他类对象同样对待。换句话说,您可以将函数存储在变量里,动态创建函数,以及将函数返回或者将函数传递给其他函数。下面我们来看一个例子...

使用 JavaScript 进行函数式编程 (一) 翻译

一个字符串可以保存为一个变量,函数也可以,例如:

var sayHello = function() { return “Hello” };

一个字符串可以保存为对象字段,函数也可以,例如:

var person = {message: “Hello”, sayHello: function() { return “Hello” }};

一个字符串可以再用到时才创建,函数也可以,例如:

“Hello ” + (function() { return “World” })(); //=> Hello World

一个字符串可以作为输入参数传给函数,则函数也可以:

    function hellloWorld(hello, world) { return hello + world() }

一个字符串可以作为函数返回值,函数也可以,例如:

return “Hello”;
return function() { return “Hello”};

高阶案例

使用 JavaScript 进行函数式编程 (一) 翻译

如果函数将其他函数函数作为输入参数或者作为返回值,则称之为高阶函数。刚才我们已经看过了一个高阶函数的例子。下面,我们来看一下更复杂的情况。

例1

[1, 2, 3].forEach(alert);
// alert 弹窗显示“1" 
// alert 弹窗显示 "2" 
// alert 弹窗显示 "3”

例2

function splat(fun) {
   return function(array) {
        return fun.apply(null, array);
   };
}
var addArrayElements = splat(function(x, y) { return x + y });
addArrayElements([1, 2]);
//=> 3

最爱纯函数

使用 JavaScript 进行函数式编程 (一) 翻译

纯函数不会有其他的副作用,所谓的副作用指的是函数所产生的对函数外界状态的修改。比如:

  • 修改某个变量

  • 修改数据结构

  • 对外界某个变量设置字段

  • 抛出例外或者弹出错误信息

最简单的例子就是数学函数。Math.sqrt(4) 函数总是返回2。他不会用到任何其他心寒信息,如状态或者设置参数。数学函数从来不会造成任何副作用。

避免修改状态


使用 JavaScript 进行函数式编程 (一) 翻译

函数式编程支持纯粹的函数,这样的函数不能改变数据,因此大多用于创建不可改变的的数据。这种方式,不用修改一个已存在的数据结构,而且能高效的新建一个.
你也许想知道,如果一个纯粹的函数通过改变一些本地数据而生产一个不可改变的返回值,是否是允许的?答案是可以。
在JavaScript中极少的数据类型是默认是不可改变的。String是一个不能被改变的数据类型的例子:

   var s = "HelloWorld";
    s.toUpperCase();
    //=> "HELLOWORLD"
    s;
    //=> "HelloWorld"

不可改变状态的好处

    •    避免混乱和增加程序的准确性:在复杂系统内,大多数难以理解的Bug是由于状态通过在程序中外部客户端代码修改而导致的。

    •    确立“快速简洁”的多线程编程:如果多线程可以修改同一个共享值,你不得不同步的获取值。这对专家来说都是十分乏味并且易出错的编程挑战。

软件事务内存和Actor模型提供了直接在线程安全方式下处理修改。

使用递归而非循环调用

使用 JavaScript 进行函数式编程 (一) 翻译

递归是最有名的函数式编程技术。如果您还不知道它的话,那么可以理解为递归函数就是一个可以调用自己的函数。

替代反复循环的最经典方式就是使用递归,即每次完成函数体操作之后,再继续执行集合里的下一项,直到满足结束条件。递归还天生符合某些算法实现,比如遍历树形结构(每个树枝都是一颗小树)。

在任何语言里,递归都是一项重要的函数式编程方式。很多函数语言甚至要求的更加严格:只支持递归遍历,而不支持显式的循环遍历。这需要语言必须保证消除了尾端调用,这是 JavasSrip 不支持的。

惰性求值优于激进计算

使用 JavaScript 进行函数式编程 (一) 翻译

数学定义了很多无穷集合,比如自然数(所有的正整数)。他们都是符号表示。任意特定有限的子集都在需要时求值。我们将其称之为惰性求值(也叫做非严格求值,或者按需调用,延迟执行)。及早求值会强迫我们表示出所有无穷数据,而这显然是不可能的。

很多语言都默认是惰性的,有些也提供了惰性数据结构以表达无穷集合,并在需要时对自己进行精确计算。

很明显一行代码 result = compute() 所表达的是将 compute() 的返回结果赋值给 result。但是 result 的值究竟是多少只有其被用到的时候才有意义。

可见策略的选择会在很大程度上提高性能,特别是当用在链式处理或者数组处理的时候。这些都是函数式程序员所喜爱的编程技术。

这就开创可很多可能性,包括并发执行,并行技术以及合成。

但是,有一个问题,JavaScrip 并不对自身进行惰性求值。话虽如此,Javascript 里的函数库可以有效地模拟惰性求值。

闭包的全部好处

所有的函数式语言都有闭包,然而这个语言特性经常被讨论得很神秘。闭包是一个函数,这个函数有着对内部引用的所有变量的隐式绑定。换句话说,该函数对它引用的变量封闭了一个上下文。JavaScript 中的闭包是能够访问父级作用域的函数,即使父级函数已经调用完毕。

   function multiplier(factor) {
      return function(number) {
          return number * factor;
      };
   }
  var twiceOf = multiplier(2);
    console.log(twiceOf(6));
//=> 12

声明式优于命令式编程

函数式编程是声明式的,就像数学运算,属性和关系是定义好的。运行时知道怎么计算最终结果。阶乘函数的定义提供了一个例子:

factorial(n)       = 1 if n = 1

                            n * factorial(n-1) if n > 1

该定义将 factorial(n) 的值关联到 factorial(n-1),是递归定义。特殊情况下的 factorial(1) 终止了递归。

var imperativeFactorial = function(n) {
    if(n == 1) {
        return 1
    } else {
        product = 1;
        for(i = 1; i <= n; i++) {
              product *= i;
        }
        return product;
     }
}
var declarativeFactorial = function(n) {
       if(n == 1) {
             return 1
       } else {
             return n * factorial(n - 1);
      }
  }

从它实现阶乘计算来看,声明式的阶乘可能看起来像“命令式”的,但它的结构更像声明式的。

命令式阶乘使用可变值、循环计数器和结果来累加计算后的结果。这个方法显式地实现了特定的算法。不像声明式版本,这种方法有许多可变步骤,导致它更难理解,也更难避免 bug 。

使用 JavaScript 进行函数式编程 (一) 翻译

函数式JavaScript库

有很多函数式库:underscore.js, lodash,Fantasy Land, Functional.js, Bilby.js, fn.js, Wu.js, Lazy.js, Bacon.js, sloth.js, stream.js, Sugar, Folktale, RxJs 等等。

函数式程序员工具包

map(), filter(), 和 reduce()函数 构成了函数式程序员工具包的核心。 纯高阶函数成了函数式方法的主力。事实上,它们是纯函数和高阶函数应该仿效的典型。它们用一个函数作为输入,返回没有副作用的输出。

这些 JavaScript 函数对每一个函数式程序来说都是至关重要的。他们可以去除循环和语句,使得代码更加整洁。这些都是实现 ECMAScript5.1 的浏览器的标准,他们只处理数组。每次调用都会创建创建并返回一个新的数组。已存在的数组不会被修改。但是稍等,事情很不止于此。。。他们还将函数作为输入参数,通常是作为回调的匿名函数。他们会遍历将整个数组并且将该回调函数应用与每一项!

myArray = [1,2,3,4];

newArray = myArray.map(function(x) {return x*2});

console.log(myArray); // Output: [1,2,3,4]

console.log(newArray); // Output: [2,4,6,8]

除了这三个函数,还有很多函数可以扎入到几乎每一个函数式应用里:

forEach(),concat(), reverse(), sort(), every() 以及some().

JavaScript的范式

JavaScript当然不是严格意义上的函数式编程语言,这也促使了对其他范式的使用:

  • 命令式编程:基于详细操作描述式的编程

  • 基于原型的面向对象式编程:基于原型对象及其实例的编程

  • 元程序编程:操纵JavsScript执行模型的编程方式。对元程序编程的一个很好的定义描述为“编程发生在您书写代码做某事的时候,而元程序编程则发生在您书写代码导致某事的解释方式发生变化的时候。

原文地址:https://dzone.com/articles/functional-programming-using-javascript-part-1

翻译:simei231, 祝青, 李中凯

Javascript 相关文章推荐
JavaScript和CSS通过expression实现Table居中显示
Jun 28 Javascript
javascript同页面多次调用弹出层具体实例代码
Aug 16 Javascript
jQuery判断div随滚动条滚动到一定位置后停止
Apr 02 Javascript
教你如何使用firebug调试功能了解javascript闭包和this
Mar 04 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
Aug 21 Javascript
对象题目的一个坑 理解Javascript对象
Dec 22 Javascript
使用JSON作为函数的参数的优缺点
Oct 27 Javascript
开发Vue树形组件的示例代码
Dec 21 Javascript
jQuery实现的鼠标响应缓冲动画效果示例
Feb 13 jQuery
Vue实现腾讯云点播视频上传功能的实现代码
Aug 17 Javascript
基于原生JS封装的Modal对话框插件的示例代码
Sep 09 Javascript
element tree树形组件回显数据问题解决
Aug 14 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
Oct 02 #Javascript
jQuery网页右侧广告跟随滚动代码分享
Apr 20 #Javascript
jQuery+PHP星级评分实现方法
Oct 02 #Javascript
谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)
Oct 01 #Javascript
通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端的方法
Oct 01 #Javascript
基于OL2实现百度地图ABCD marker的效果
Oct 01 #Javascript
JS处理json日期格式化问题
Oct 01 #Javascript
You might like
Laravel Reponse响应客户端示例详解
2020/09/03 PHP
Prototype 学习 工具函数学习($A方法)
2009/07/12 Javascript
js函数的引用, 关于内存的开销
2012/09/17 Javascript
JQuery对id中含有特殊字符的转义处理示例
2013/09/06 Javascript
javascript实现网页子页面遍历回调的方法(涉及 window.frames、递归函数、函数上下文)
2015/07/27 Javascript
AngularJs expression详解及简单示例
2016/09/01 Javascript
微信小程序-拍照或选择图片并上传文件
2017/01/06 Javascript
Bootstrap表格制作代码
2017/03/17 Javascript
jQuery获取table表中的td标签(实例讲解)
2017/07/28 jQuery
JavaScript设计模式之观察者模式(发布订阅模式)原理与实现方法示例
2018/07/27 Javascript
vue实现自定义日期组件功能的实例代码
2018/11/06 Javascript
vue-cli系列之vue-cli-service整体架构浅析
2019/01/14 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
2020/07/24 Javascript
[48:35]2018DOTA2亚洲邀请赛 4.1 小组赛 A组加赛 TNC vs Optic
2018/04/03 DOTA
Python3计算三角形的面积代码
2017/12/18 Python
python xlsxwriter创建excel图表的方法
2018/06/11 Python
python模糊图片过滤的方法
2018/12/14 Python
Python中的引用知识点总结
2019/05/20 Python
python二进制文件的转译详解
2019/07/03 Python
Python通过kerberos安全认证操作kafka方式
2020/06/06 Python
Django中的DateTimeField和DateField实现
2021/02/24 Python
CSS3实现红包抖动效果
2020/12/23 HTML / CSS
纽约21世纪百货官网:Century 21
2016/08/27 全球购物
英国知名衬衫品牌美国网站:Charles Tyrwhitt美国
2016/08/28 全球购物
印度网上药店:1mg
2017/10/13 全球购物
缓解脚、腿和背部疼痛:Z-CoiL鞋
2019/03/12 全球购物
Travelstart沙特阿拉伯:廉价航班、豪华酒店和实惠的汽车租赁优惠
2019/04/06 全球购物
医德医风演讲稿
2014/05/20 职场文书
一个成功的互联网创业项目,必须满足这些要求
2019/08/23 职场文书
网络安全倡议书(3篇)
2019/09/18 职场文书
MySQL Threads_running飙升与慢查询的相关问题解决
2021/05/08 MySQL
教你用Python+selenium搭建自动化测试环境
2021/06/18 Python
入门学习Go的基本语法
2021/07/07 Golang
新手初学Java网络编程
2021/07/07 Java/Android
ubuntu端向日葵键盘输入卡顿问题及解决
2022/12/24 Servers