JavaScript函数式编程之pointfree与声明式编程

时间 2019-11-21

标签 javascript 函数编程 pointfree 声明栏目 JavaScript 繁體版

原文原文链接

更多相关内容见博客 github.com/zhuanyongxi…javascript

函数式编程中的pointfree的意思就是“无参”或“无值”，pointfree style是一种编程范式，也做tacit programming，就是“无参编程”的意思了。什么是“无参编程”？html

// 这就是有参的，由于有word
var snakeCase = word => word.toLowerCase().replace(/\s+/ig, '_');

// 这是pointfree
var snakeCase = compose(replace(/\s+/ig, '_'), toLowerCase);
复制代码

从另外一个角度看，有参的函数的目的是获得一个数据，而pointfree的函数的目的是获得另外一个函数。因此，以下的方程，虽然也有参，也能够认为是pointfree的。java

const titlesForYear = year =>
  pipe(
    filter(publishedInYear(year)),
    map(book => book.title)
  )
复制代码

那这pointfree有什么用？它可让咱们把注意力集中在函数上，参数命名的麻烦确定是省了，代码也更简洁优雅。须要注意的是，一个pointfree的函数多是由众多非pointfree的函数组成的，也就是说底层的基础函数大都是有参的，pointfree体如今用基础函数组合而成的高级函数上。若是咱们使用函数式编程的工具，如ramda，这些基础函数大都已经被写好了，这样咱们去写pointfree的代码就很容易了。git

什么是声明式编程？它区别于命令式编程github

// 命令式
var words = [];
for (i = 0; i < otherWords.length; i++) {
  words.push(otherWords[i].word);
}

// 声明式
var words = otherWords.map(function(ele){ return ele.word; });
复制代码

容易看出，命令式的代码，咱们不但要去遍历，还要关注如何遍历。而声明式的就容易不少，能够节省咱们的注意力，代码也更加简洁。编程

其余的命令式的写法有：使用ifelse进行的条件判断，使用算数运算符进行的算数运算，使用比较运算符进行的比较运算和使用逻辑运算符进行的逻辑运算。数组

至于那些说“虽然如此，但使用命令式循环速度要快不少”的人，我建议大家先去学学 JIT 优化代码的相关知识。这里有一个很是棒的视频，可能会对你有帮助。ide

须要注意的是，要实现这种声明式的编程，首先咱们要有这个map方法，这一点与pointfree相同，都是须要咱们先对经常使用的操做作一次封装，而这些经常使用的操做自己仍是命令式的。函数式编程

pointfree的声明式代码是函数式编程应该有的样子。函数

最后用一个来自Scott Sauyet的文章《Favoring Curry》中的例子，使用的函数式工具是ramda。下面的代码不须要一句一句的看，大概体会一下就能够了。

一组JSON数据

var data = {
    result: "SUCCESS",
    interfaceVersion: "1.0.3",
    requested: "10/17/2013 15:31:20",
    lastUpdated: "10/16/2013 10:52:39",
    tasks: [
        {id: 104, complete: false,            priority: "high",
                  dueDate: "2013-11-29",      username: "Scott",
                  title: "Do something",      created: "9/22/2013"},
        {id: 105, complete: false,            priority: "medium",
                  dueDate: "2013-11-22",      username: "Lena",
                  title: "Do something else", created: "9/22/2013"},
        {id: 107, complete: true,             priority: "high",
                  dueDate: "2013-11-22",      username: "Mike",
                  title: "Fix the foo",       created: "9/22/2013"},
        {id: 108, complete: false,            priority: "low",
                  dueDate: "2013-11-15",      username: "Punam",
                  title: "Adjust the bar",    created: "9/25/2013"},
        {id: 110, complete: false,            priority: "medium",
                  dueDate: "2013-11-15",      username: "Scott",
                  title: "Rename everything", created: "10/2/2013"},
        {id: 112, complete: true,             priority: "high",
                  dueDate: "2013-11-27",      username: "Lena",
                  title: "Alter all quuxes",  created: "10/5/2013"}
        // , ...
    ]
};
复制代码

需求是找到Scott全部未完成的任务，并按照到期日期升序排列。

正确的结果是

[
    {id: 110, title: "Rename everything", 
        dueDate: "2013-11-15", priority: "medium"},
    {id: 104, title: "Do something", 
        dueDate: "2013-11-29", priority: "high"}
]
复制代码

命令式的代码以下

getIncompleteTaskSummaries = function(membername) {
    return fetchData()
        .then(function(data) {
            return data.tasks;
        })
        .then(function(tasks) {
            var results = [];
            for (var i = 0, len = tasks.length; i < len; i++) {
                if (tasks[i].username == membername) {
                    results.push(tasks[i]);
                }
            }
            return results;
        })
        .then(function(tasks) {
            var results = [];
            for (var i = 0, len = tasks.length; i < len; i++) {
                if (!tasks[i].complete) {
                    results.push(tasks[i]);
                }
            }
            return results;
        })
        .then(function(tasks) {
            var results = [], task;
            for (var i = 0, len = tasks.length; i < len; i++) {
                task = tasks[i];
                results.push({
                    id: task.id,
                    dueDate: task.dueDate,
                    title: task.title,
                    priority: task.priority
                })
            }
            return results;
        })
        .then(function(tasks) {
            tasks.sort(function(first, second) {
                var a = first.dueDate, b = second.dueDate;
                return a < b ? -1 : a > b ? 1 : 0;
            });
            return tasks;
        });
};
复制代码

pointfree的代码

var getIncompleteTaskSummaries = function(membername) {
  return fetchData()
    .then(R.prop('tasks'))
    .then(R.filter(R.propEq('username', membername)))
    .then(R.reject(R.propEq('complete', true)))
    .then(R.map(R.pick(['id', 'dueDate', 'title', 'priority'])))
    .then(R.sortBy(R.prop('dueDate')));
};
复制代码

pointfree的声明式的代码

// 提取 tasks 属性
var SelectTasks = R.prop('tasks');

// 过滤出指定的用户
var filterMember = member => R.filter(
  R.propEq('username', member)
);

// 排除已经完成的任务
var excludeCompletedTasks = R.reject(R.propEq('complete', true));

// 选取指定属性
var selectFields = R.map(
  R.pick(['id', 'dueDate', 'title', 'priority'])
);

// 按照到期日期排序
var sortByDueDate = R.sortBy(R.prop('dueDate'));

// 合成函数
var getIncompleteTaskSummaries = function(membername) {
  return fetchData().then(
    R.pipe(
      SelectTasks,
      filterMember(membername),
      excludeCompletedTasks,
      selectFields,
      sortByDueDate,
    )
  );
};
复制代码

参考文章