这里是用 JavaScript 做的逆转序列(数组/字符串)的递归/尾递归实现。另外还尝鲜用了一下 ES6 的destructuring assignment + spread operator 做了一个更 functional 的版本(只支持数组)。

正确性能通过测试(参见 放在我 Github 上的 demo,顺手写了一个小小的测试框架),不过效率就要打问号了——特别是用了 ES6 特性的版本。这里主要是写来玩 JS 的函数式特性的。

1. 逆转序列的递归实现

先用 Haskell 实现做草稿(因为比较自然),数组版长这样

reverse' :: [a] -> [a]
reverse' [] = []
reverse' (x:xs) = reverse' xs ++ [x]

在 JavaScript 里,数组和字符串都有 sliceconcat,所以可以写成两种“序列”(在离散数学之类的领域里经常把两者合称为 sequence) 都支持的版本。

Note:

均出现于 ECMAScript 3,实现于 JavaScript 1.2

对应的 JS 实现如下,把 base case 设定到序列长度小于 1 的时候,这样缩减了一步递归。相比而言还是 Haskell 版比较一目了然啊……

function recursiveReverse(seq) {
return seq.length > 1 ?
recursiveReverse(seq.slice(1)).concat(seq.slice(0, 1)) : seq;
}

经过测试,数组和字符串都能通过。

2. 尾递归实现

Haskell 版本长这样,用一个 ret 传递已完成的部分:

reverse' :: [a] -> [a]
reverse' list = rev list []
where rev [] ret = ret
rev (x:xs) ret = rev xs (x:ret)

对应的 JS 版本,这里用 slice(0, 0) 来避开类型检查创建空序列。

function tailReverse(seq) {
return (function rev(seq, ret) {
return seq.length > 0 ?
rev(seq.slice(1), seq.slice(0, 1).concat(ret)) : ret;
})(seq, seq.slice(0, 0));
}

经过测试,数组和字符串都能通过。

3. 使用 ES6 新特性的递归版本

ES6 引入了 destructuring assignmentspread operator,这样就可以部分地使用函数式编程中的模式匹配(pattern matching)。不过我在 ES6 的新特性里还没找到能在语法层面上让 JS 的函数像 Haskell 那样将模式匹配融合进重载(overloading)的组合(destructuring assignment 本身就是模式匹配的一个子集而已),要重载还是得用当前 JS 里最常见的解决办法——if-else或者三目运算符配合类型检查。这里因为用法简单,直接三目运算符就行。

配合 ES6 新特性实现的简单递归版如下,因为 JS 里数组和字符串没有通用的功能类似 append (往后加元素并返回新的数组)的函数,懒得折腾类型检查了,所以这里只实现了数组版(由于 destructuring assignment + spread operator 的组合[x, ...xs]会将字符串分割成第一个字符,[其他字符组成的数组],因此直接给下面的函数传入字符串之后再将返回值 join 回字符串也可以达到一样的效果)。

function pmReverse([x, ...xs]) {
return typeof x === "undefined" ? [] : pmReverse(xs).concat([x]);
}

经过测试,数组都可以正常逆转(只有在浏览器打开 ES6 特性的时候这个页面才会正常跑掉这个版本的测试,不然就只有一个 alert)。

4. 使用 ES6 新特性的尾递归版本

function pmTailReverse(list) {
return (function rev([x, ...xs], ret) {
return typeof x === "undefined" ? ret : rev(xs, [x].concat(ret));
})(list, []);
}

经过测试,数组都可以正常逆转(只有在浏览器打开 ES6 特性的时候这个页面才会正常跑掉这个版本的测试,不然就只有一个 alert)。

关于测试页面

为了方便写了一个小小的测试框架,参见源代码

因为不支持 ES6 的浏览器在解析 ES6 特性的代码时会出语法错误,用 try-catch 抓不了,这里用了 window.onerror 来捕捉并提示。不知为何我的 Chrome 开了实验性 JS 依然打不开 ES6 支持…… FireFox 倒是默认就能用。

逆转序列的递归/尾递归(+destructuring assignment)实现(JavaScript + ES6)的更多相关文章

  1. Destructuring Assignment in JS(解构assignment in js)

    Destructuring Assignment In JavaScript 更省事,代码显得也清楚. Arrays 传统的声明赋值: let johnDoe = ["John", ...

  2. 解构赋值 Destructuring Assignment

    解构赋值 Destructuring Assignment ES6中可以通过一定的模式将数组或对象中的值直接赋值给外部变量,称为解构 对象的解构赋值 // 在ES5中,当需要获取一个对象中的变量值的时 ...

  3. destructuring assignment

    [destructuring assignment] The destructuring assignment syntax is a JavaScript expression that makes ...

  4. [ES6] 08. Destructuring Assignment -- 1

    Here is the way you get value from an object: var obj = { color: "blue" } console.log(obj. ...

  5. ES6 Destructuring Assignment All In One

    ES6 Destructuring Assignment All In One ES6 & Destructuring Assignment Axios, vue https://develo ...

  6. Object Destructuring Assignment vs Object.assign

    Object Destructuring Assignment vs Object.assign // const params = Object.assign({}, this.$route.par ...

  7. js destructuring assignment bug

    js destructuring assignment bug https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Op ...

  8. 斐波那契数列 递归 尾递归 递推 C++实现

    ==================================声明================================== 本文原创,转载请注明作者和出处,并保证文章的完整性(包括本 ...

  9. kotlin递归&尾递归优化

    递归: 对于递归最经典的应用当然就是阶乘的计算啦,所以下面用kotlin来用递归实现阶乘的计算: 编译运行: 那如果想看100的阶乘是多少呢? 应该是结果数超出了Int的表述范围,那改成Long型再试 ...

随机推荐

  1. Linux: shell常用通配符

    字符 含义 * 匹配 0 或多个字符 ? 匹配任意一个字符 [list] 匹配 list 中的任意单一字符 [!list] 匹配 除list 中的任意单一字符以外的字符 [c1-c2] 匹配 c1-c ...

  2. Windows Phone 8 解锁提示IpOverUsbSvc问题——IpOverUsbEnum返回No connected partners found解决方案

    我的1520之前总是无法解锁,提示:IpOverUsbSvc服务没有开启什么的. 根据网上网友的各种解决方案: 1. 把手机时间设置为当前时间,并且关闭“自动设置” 2. 确保手机接入了互联网 3.确 ...

  3. thrift之TTransport层的分帧传输类TFramedTransport

    帧传输类就是按照一帧的固定大小来传输数据,所有的写操作首先都是在内存中完成的直到调用了flush操作,然后传输节点在flush操作之后将所有数据根据数据的有效载荷写入数据的长度的二进制块发送出去,允许 ...

  4. Spring AOP(配置文件方式)

    spring配置文件: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="h ...

  5. CSS3 圆角制作的消息提示图标

    CSS3 圆角制作的消息提示图标,如果你想知道它是如何被开发的,请点击连接查看.http://www.gbtags.com/gb/rtreplayerpreview/142.htm

  6. iOS开发-友盟分享使用(2)

    1.友盟SDK提供功能:分享喜欢的东西到新浪微博.qq空间.为微信朋友圈等等等等社交圈. 2.友盟分享前期准备 (1)注册账号 去官网 (2)创建应用获取appkey 类似5556a53667e*** ...

  7. js实现点击一个按钮进行两种状态的切换(toggle)

    <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8 ...

  8. JavaWeb学习总结(十七)——JSP中的九个内置对象

    一.JSP运行原理 每个JSP 页面在第一次被访问时,WEB容器都会把请求交给JSP引擎(即一个Java程序)去处理.JSP引擎先将JSP翻译成一个_jspServlet(实质上也是一个servlet ...

  9. Leetcode 125 Valid Palindrome 字符串处理

    题意:判断字符串是否是回文字符串 先将所有的字母和数字字符保留,并将大写字母转化成小写字母,然后将字符串倒置,比较前后两个字符串是否相同. 该题最好的解法可以模仿 Leetcode 345 Rever ...

  10. (二)关于ajax那些事

    哈哈,今天突然兴起,想了想自己对ajax的了解,来这里叙述下.心情好,嘿嘿嘿 ajax是一种创建交互式网页应用的网页开发技术.就是在不重新加载页面的情况下,更新部分网页. ajax原理:ajax就是相 ...