函数式编程

1、为什么要学习函数式编程

  • 函数式编程是随着React的流行受到越来越多的关注

  • Vue3也开始拥抱函数式编程

  • 函数式编程可以抛弃this

  • 打包过程中可以更好地利用 tree shaking 过滤无用代码

  • 方便测试 、方便并行处理

  • 有很多库可以帮助我们进行函数开发:loadsh、underscore、ramda

2、什么是函数式编程

函数式编程(Functional Programming, FP),FP是编程范式之一,常见的编程范式还有面向对象编程和面向过程编程。

  • 面向对象编程的思想:把现实世界中的事物抽象成程序世界中的类和对象,通过封装、继承和多态来演示事物事件的联系

  • 函数式编程的思想:把现实世界的事物和事物之间的联系抽象到程序世界(对运算过程进行抽象)

    • 程序本质:根据输入通过某种运算获得响应的输出,程序开发过程中会涉及很多的输入输出函数

    • x->f(联系、映射)->y,y=f(x)

    • 函数式编程中的函数指的不是程序中的函数(方法),而是数学中的函数即映射关系,例如:y = sin(x), x和y的关系

    • 相同的输入始终要得到相同的输出(纯函数)

    • 函数式编程用来描述数据(函数)之间的映射

// 非函数式
let num1 = 1
let num2 = 2
let sum = num1 + num2
console.log(sum)

// 函数式
function add(n1 + n2) {
	return n1 + n2
}
let sum = add(1, 2)
console.log(sum)

3、函数是一等公民

MDN first-class Function

  • 函数可以储存在变量中

  • 函数可以作为参数

  • 函数作为返回值

在JavaScript中函数就是一个普通对象(可以通过 new Function() ),我们可以把函数存储到变量/数组中,它还可以作为另一个函数的参数和返回值,甚至我们可以在程序运行的时候通过 new Function('alert(1)')来构造一个新的函数。

  • 把函数赋值给变量
// 把函数赋值给变量
let fn = function(){
	console.log()
}
// 一个示例
const BlogController = {
  index (posts) { return Views.index(posts) },
  show (post) { return Views.show(post) },
  create (attrs) { return Db.create(attrs) },
  update (post, attrs) { return Db.update(post, attrs) },
  destroy (post) { return Db.destroy(post) }
}

// 优化
const BlogControllerAfter = {
  index: Views.index,
  show: Views.show,
  create: Db.create,
  update: Db.update,
  destroy: Db.destroy
}

4、高阶函数

  • 什么是高阶函数(Higher order function)

    • 可以把函数当成参数传递给另一个函数

    • 可以把函数作为另一个函数的返回结果

  • 函数作为参数

// 高阶函数-函数作为参数
function forEach(arr, fn){
  for(let i = 0; i < arr.length; i++){
    fn(arr[i])
  }
}

// 测试
let arr = [1, 3, 4, 6, 5]
forEach(arr, function(item){
  console.log(item)
})

// filter
function filter (arr, fn){
  let result = []
  for(let i = 0; i < arr.length; i++) {
    if (fn(arr[i])){
      result.push(arr[i])
    }
  }
  return result
}

// 测试
let arr1 = [1, 3, 4, 6, 5]
let r = filter(arr1, function(item) {
  return item % 2 === 0
})
console.log(r)
  • 函数作为返回值
 // 函数作为返回值
function makeFn() {
  let msg = 'Hello Fn'
  return function () {
    console.log(msg)
  }
}

const fn = makeFn()
fn()


// once
function once(fn) {
  let done = false
  return function() {
    if(!done) {
      done = true
      return fn.apply(this, arguments)
    }
  }
}

let pay = once(function(money) {
  console.log(`支付: ${money}`)
})

pay(5)
pay(6)
  • 常用的高阶函数模拟
// map
const map = (array, fn) => {
  let result = []
  for(let item of array) {
    result.push(fn(item))
  }
  return result
}

// 测试。求平方
let arr = [1,2,3,4]
arr = map(arr, v => v * v)
console.log(arr)


// some
const some = (array, fn) => {
  for(let item of array) {
    if(fn(item)){
      return true
    }
  }
  return false
}

// 测试
let arr1 = [1,3,5,7]
console.log(some(arr1, v => v % 2 === 0))


// every
const every = (array, fn) => {
  for(let item of array) {
    if(!fn(item)){
      return false
    }
  }
  return true
}

// 测试
let arr2 = [2, 4, 6, 8]
console.log(every(arr2, v => v % 2 === 0))

5、闭包

  • 闭包(Closure):函数和其周围的状态(词法环境)的引用捆绑在一起形成闭包

    • 可以在另一个作用域中调用一个函数的内部函数并访问该函数的作用域中的成员
 // 函数作为返回值
function makeFn() {
  let msg = 'Hello Fn'
  return function () {
    console.log(msg)
  }
}

const fn = makeFn()
fn()
- 闭包的本质:函数在执行的时候会放到一个执行栈上,当函数执行完毕之后会从执行栈上移除,但是堆上的作用域成员因为被外部引用不能释放,因此内部函数依然可以访问外部函数的成员
  • 案例1:求幂
// 求幂方法制造
function makePower(power) {
    return function (number) {
        return Math.pow(number, power)
    }
}

// 平方
let power2 = makePower(2)
// 立方
let power3 = makePower(3)

// 测试
console.log(power2(2))
console.log(power2(3))
console.log(power3(2))
console.log(power3(3))
  • 案例2:工资计算
// 基本工资+绩效工资
function makeSalary (base) {
    return function (performance) {
        return base + performance
    }
}
// 基本工资
let salaryLevel1 = makeSalary(12000)
let salaryLevel2 = makeSalary(15000)

// 测试
console.log(salaryLevel1(2000))
console.log(salaryLevel2(3000))

6、纯函数

  • 概念:相同的输入永远会得到相同的输出,而且没有任何可观察的副作用

    • 纯函数就类似数学中的函数(用来描述输入和输出之间的关系),y = f(x)
  • loadsh是一个纯函数的功能库,提供了对数组、数字、对象、字符串、函数等操作的一些方法

  • 数组的slice和splice,分别是纯函数和不纯函数

    • slice 返回数组中的指定部分,不会改变原数组

    • splice 对数组进行操作返回该数组,会改变原数组

let array = [1, 2, 3, 4, 5]
// 结果相同,纯函数slice
console.log(array.slice(0, 3)) // [ 1, 2, 3 ]
console.log(array.slice(0, 3)) // [ 1, 2, 3 ]
console.log(array.slice(0, 3)) // [ 1, 2, 3 ]

// 结果不同,不纯函数splice
console.log(array.splice(0, 3)) // [ 1, 2, 3 ]
console.log(array.splice(0, 3)) // [ 4, 5 ]
console.log(array.splice(0, 3)) // []

// 纯函数
function getSum (n1, n2) {
    return n1 + n2
}
// 测试
console.log(getSum(1, 2)) // 3
console.log(getSum(1, 2)) // 3
console.log(getSum(1, 2)) // 3
  • 函数式编程不会保留计算中间的结果,所以变量是不可变的(无状态的)

  • 我们可以把一个函数的执行结果交给另一个函数去处理

  • loadsh 使用:

// 演示 1odash
// first / last / toUpper / reverse / each / includes / find / findIndex
const _ = require('lodash')

const array = ['jack', 'tom', 'lucy', 'kate']

console.log(_.first(array))
console.log(_.last(array))
console.log(_.toUpper(_.first(array)))
console.log(_.reverse(array))
const r = _.each(array, (item, index) => {
    console.log(item, index)
})
console.log(r)
console.log(_.includes(array, 'jack1'))
console.log(_.find(array, null,2))
console.log(_.findIndex(array, o => o === 'tom' ))
  • 纯函数的好处

    • 可缓存:因为纯函数对相同的输入始终有相同的结果,所以可以把纯函数的结果缓存起来
// 记忆函数
const _ = require('lodash')

function getArea(r) {
    console.log(r) // 发现只会走一次,表示结果已经缓存
    return Math.PI * r * r
}

let getAreaWithMemory = _.memoize(getArea)
console.log(getAreaWithMemory(4))
console.log(getAreaWithMemory(4))
console.log(getAreaWithMemory(4))
- 自己模拟一个memoize函数
// 模拟memoize方法的实现
function memoize(f) {
    let cache = {}
    return function () {
        let key = JSON.stringify(arguments)
        cache[key] = cache[key] || f.apply(f, arguments)
        return cache[key]
    }
}
let getAreaWithMemory = memoize(getArea)
console.log(getAreaWithMemory(4))
console.log(getAreaWithMemory(4))
console.log(getAreaWithMemory(4))
  • 可测试

    • 纯函数让测试更方便
  • 并行处理

    • 在多线程环境下并行操作共享的内存数据可能会出现意外情况

    • 纯函数不需要访问共享的内存数据,所以在并行环境下可以任意运行出函数(Web Worker)

  • 没有任何可观察的副作用

// 不纯的
let mini = 18
function checkAge(age) {
	return age >= min
}

// 纯的(有硬编码,后续通过柯里化解决)
function checkAge(age) {
	let mini = 18
	return age >=min
}

副作用让一个函数变得不纯(如上例),纯函数根据相同的输入返回相同的输出,如果函数依赖于外部的状态就无法保证输出的相同,就会带来副作用。

  • 副作用来源:

    • 配置文件

    • 数据库

    • 获取用户的输入

    • ......

所有的外部交互都有可能带来副作用,副作用也使得方法通用性下降不适合扩展和重用,同时副作用会给程序带来安全隐患和不确定性,但是副作用不可能完全禁止,尽可能控制它们在可控范围内发生。

7、柯里化(Currying)

当一个函数有多个参数的时候,先传递一部分参数调用它(先传的参数以后永远不变),然后返回一个新的函数接收剩余参数,处理后返回结果。

// 柯里化演示
function checkAge(age) {
    let mini = 18
    return age >= mini
}

// 普通纯函数
function checkAge(mini, age) {
    return age >= mini
}
// 测试
console.log(checkAge(18, 20))
console.log(checkAge(18, 24))
console.log(checkAge(22, 24))

// 函数柯里化改造
function makeCheckAge(mini) {
    return function (age) {
        return age >= mini
    }
}
let checkAge18 = makeCheckAge(18)
let checkAge20 = makeCheckAge(20)
console.log(checkAge18(19))
console.log(checkAge20(19))

// es6箭头函数
let makeCheckAgeEs = mini => age => age >= mini;
let checkAgeEs18 = makeCheckAgeEs(18)
let checkAgeEs20 = makeCheckAgeEs(20)
console.log(checkAgeEs18(19))
console.log(checkAgeEs20(19))
  • lodash中的柯里化 _.curry(func)

    • 功能:创建一个函数,该函数接收一个或多个func的参数,如果func所需的参数都被提供则执行func并返回执行结果,否则继续返回该函数并等待接受剩余的参数

    • 参数:需要柯里化的函数

    • 返回值:柯里化后的函数

// lodash 中的 curry 基本使用
const _ = require('lodash')

function getSum(a, b, c) {
    return a + b + c
}
console.log(getSum(1, 2, 3))

const curriedGetSum = _.curry(getSum)

console.log(curriedGetSum(1, 2, 3))
console.log(curriedGetSum(1)(2, 3))
console.log(curriedGetSum(1, 2)(3))
  • 柯里化案例
// 柯里化案例
// 面向过程示例
console.log('12 32 56'.match(/\s+/g))
console.log('12 32 56'.match(/\d+/g))

// 纯函数
function match(reg, str) {
    return str.match(reg)
}

// 柯里化
const _ = require('lodash')
const curryMatch = _.curry(function (reg, str) {
    return str.match(reg)
})

const havaSpace = curryMatch(/\s+/g)
const havaNumber = curryMatch(/\d+/g)
console.log(havaSpace('hello world'))
console.log(havaNumber('abc'))

// 过滤数组中具有空白字符的元素
const filter = _.curry(function (func, array) {
    return array.filter(func)
})
console.log(filter(havaSpace, ['John Connor', 'John_Done']))

// 进一步封装
const findSpace = filter(havaSpace)
console.log(findSpace(['John Connor', 'John_Done']))
  • 模拟实现lodash中的curry方法
function getSum(a, b, c) {
    return a + b + c
}

// 模拟
function curry(func) {
    return function curried (...args) {
        // 使用func.length可以取到传入的函数参数的个数
        if(args.length < func.length){
            return function () {
                return curried(...args.concat(Array.from(arguments)))
            }
        }
        return func(...args)
    }
}

const curryGetSum = curry(getSum)
console.log(curryGetSum(1, 2, 3))
console.log(curryGetSum(1)(2, 3))
console.log(curryGetSum(1, 2)(3))
  • 总结

    • 柯里化可以让我们给一个函数传递较少的参数得到一个已经记住某些固定参数的新函数

    • 这是一种对函数参数的“缓存”

    • 让函数变得更灵活,让函数的粒度更小

    • 可以把多元函数换成一元函数,可以组合使用函数产生强大的功能

8、组合函数

  • 纯函数和柯里化很容易写出洋葱代码h(g(f(x)))

  • 函数组合可以让我们把细粒度的函数重新生成一个新的函数

  • 管道:

    • 给 fn 函数输入参数 a , 返回结果 b , 可以想象 a 数据经过一个管道得到了 b 数据

    • 当 fn 比较复杂时,可以把函数 fn 拆成多个小函数,此时多了中间运算过程产生的 m 和 n 中间值。

  • 概念:如果一个函数要经过多个函数处理才能得到最终值,这个时候可以把中间过程函数合并成一个函数

    • 函数就像是数据的管道,函数组合就是把这些管道连接起来,让数据穿过多个管道形成最终结果

    • 函数组合默认是从右到左执行

// 求数组的最后一项
const _ = require('lodash')

function reverse(array) {
    return array.reverse()
}

function first(array) {
    return array[0]
}

function compose(f, g) {
    return function (value) {
        return f(g(value))
    }
}

// 测试
const last = compose(first, reverse)
console.log(last(['a', 'b', 'c']))
  • lodash中的组合函数

    • lodash 中的组合函数 flow() 或者 flowRight() ,他们都可以组合多个函数

    • flow() 是从左往右执行

    • flowRight() 是从右往左执行,使用的更多一些

const _ = require('lodash')
// 纯函数
const reverse = array => array.reverse()
const first = array => array[0]
const upperCase = str => str.toUpperCase()
// 演示
const upperCaseLast = _.flowRight(upperCase, first, reverse)
console.log(upperCaseLast(['hello', 'function', 'compose']))
  • 组合函数的实现原理
function compose(...args) {
    return function (value) {
        return args.reverse().reduce(function (acc, fn) {
            return fn(acc)
        }, value)
    }
}

// 测试
const upperCaseLast1 = compose(upperCase, first, reverse)
console.log(upperCaseLast1(['hello', 'function', 'compose']))

// es6改造 compose()
const composeEs6 = (...args) => value => args.reverse().reduce((acc, fn) => fn(acc), value)
const upperCaseLast2 = composeEs6(upperCase, first, reverse)
console.log(upperCaseLast2(['hello', 'function', 'compose']))
  • 函数的组合要满足结合律

compose(compose(f, g), h) === compose(f, compose(g, h)) === compose(f, g, h)

const _ = require('lodash')

const lastUpper = _.flowRight(_.toUpper, _.first, _.reverse)
console.log(lastUpper(['one', 'two', 'three']))

const lastUpper1 = _.flowRight(_.flowRight(_.toUpper, _.first), _.reverse)
console.log(lastUpper1(['one', 'two', 'three']))

const lastUpper2 = _.flowRight(_.toUpper, _.flowRight(_.first, _.reverse))
console.log(lastUpper2(['one', 'two', 'three']))
  • 函数组合调试
// NEVER SAY DIE => never-say-die
// 先用空格分割,再转为小写,最后用-拼接
const _ = require('lodash')

// _.split(string, separator, limit)  最后一个参数可不填,因为函数组合的参数必须是一个,
// 所以使用函数柯里化curry包裹,可以在调用时,先指定一个参数,返回只有一个参数的函数,而且我们
// 想先传入第二个参数,所以要交换参数顺序
const split = _.curry((sep, str) => _.split(str, sep))

// _.toLower(str) 参数只有一个,可以直接使用

// _.join(array, separator) 同样需要柯里化,并且交换参数顺序
const join = _.curry((sep, arr) => _.join(arr, sep))

const f = _.flowRight(join('-'), _.toLower, split(' '))
console.log(f('NEVER SAY DIE'))
// 结果为:n-e-v-e-r-,-s-a-y-,-d-i-e,不是预期结果,写一个log函数进行调试
const log = v => {
    console.log(v)
    return v
}

const f1 = _.flowRight(join('-'), _.toLower, log, split(' '))
console.log(f1('NEVER SAY DIE'))
// log函数输出为:[ 'NEVER', 'SAY', 'DIE' ],是预期结果,在调试下一个

const f2 = _.flowRight(join('-'), log, _.toLower, split(' '))
console.log(f2('NEVER SAY DIE'))
// log函数输出为:never,say,die 不是预期的数组形式,所以要使用map函数修改

// _.map(arr, fn) 两个参数,需要柯里化处理才能组合
const map = _.curry((fn, arr) => _.map(arr, fn))

const f3 = _.flowRight(join('-'), map( _.toLower), split(' '))
console.log(f3('NEVER SAY DIE'))
// log函数输出为:never-say-die 为预期结果
,如果我们同时组合两个log函数,
// 输出会不清晰,所以改造log函数为trace函数

const trace = _.curry((tag, v) =>{
    console.log(`${tag}: ${v}`)
    return v
})
const f4 = _.flowRight(join('-'), trace('map 之后'), map( _.toLower), trace('split 之后'), split(' '))
console.log(f4('NEVER SAY DIE'))
  • lodash中的fp模块:提供了实用的对函数式编程友好的方法,提供了不可变 auto-curried iterate-first data-last 的方法
// 改造上一个示例
// NEVER SAY DIE => never-say-die
// 先用空格分割,再转为小写,最后用-拼接
const fp = require('lodash/fp')

const f = fp.compose(fp.join('-'), fp.map(fp.toLower), fp.split(' '))
console.log(f('NEVER SAY DIE'))
  • lodash 和 lodash/fp 中 map 的区别
const _ = require('lodash')
// 将数组中的字符串转为整数
console.log(_.map(['11', '22', '33'], parseInt))
// 输出为[ 11, NaN, NaN ] ,原因是map传给的给第二个参数,也就是parseInt的值
// 为 (value, index, collection),也就是:('11', 0, ['11', '22', '33'])、
// ('22', 1, ['11', '22', '33'])、('33', 2, ['11', '22', '33']),而
// parseInt接收两个参数(string, radix),字符串和进制(限制为2-36,为0的时候转为
// 十进制),所以第二个是NaN,第三个是因为2进制的范围是[0-1],所以不能识别

const fp = require('lodash/fp')
console.log(fp.map(parseInt, ['11', '22', '33']))
// 输出为:[ 11, 22, 33 ],正常显示,这是因为fp的map方法中传给第一个参数,也就是
// parseInt的值只有一个value, parseInt接收两个参数(value, radix),后面的进制省略
// 默认为十进制
  • PointFree模式:我们可以把数据处理的过程定义成与数据无关的合成运算,不需要用到代表数据的那个参数,只要把简单的运算步骤合成到一起,在使用这种模式之前我们需要定义一些辅助的基本运算函数
// 转换: Hello World => hello_world
// 非point free 模式
const f = str => str.toLowerCase().replace(/\s+/g, '_')
console.log(f('Hello World'))

// point free
const fp = require('lodash/fp')
const g = fp.flowRight(fp.replace(/\s+/g, '_'), fp.toLower)
console.log(g('Hello World'))
  • point free案例:
// 把一个字符串中的首字符提取并转换为大写,使用. 作为分隔
// world wild web => W. W. W
const fp = require('lodash/fp')

const upperFirstLetter = fp.flowRight(fp.join('. '), fp.map(fp.first), fp.map(fp.toUpper), fp.split(' '))
console.log(upperFirstLetter('world wild web'))
// 输出为:W. W. W    但是调用了两次map,数组遍历两次,优化一下

const upperFirstLetter2 = fp.flowRight(fp.join('. '), fp.map(fp.flowRight(fp.first, fp.toUpper)), fp.split(' '))
console.log(upperFirstLetter2('world wild web'))

9、Functor(函子)

在函数式编程中如何把副作用控制在可控的范围内、异常处理、异步操作等

  • 什么是Functor

    • 容器:包含值和值得变形关系(这个变形关系就是函数)

    • 函子:是一个特殊的容器,通过一个普通的对象来实现,该对象具有 map 方法,map 方法可以运行一个函数对值进行处理(变形关系)

// 函子
class Container {
    constructor(value) {
        this._value = value
    }
    map (fn) {
        return new Container(fn(this._value))
    }
}

const r = new Container(3)
.map(x => x + 1)
.map(x => x * x)

console.log(r)
// 输出为Container { _value: 16 }

// 改造,不使用new去创建使用
class ContainerNew {
    static of(value) {
        return new ContainerNew(value)
    }

    constructor(value) {
        this._value = value
    }
    map (fn) {
        return ContainerNew.of(fn(this._value))
    }
}

const s = ContainerNew.of(5)
    .map(x => x + 1)
    .map(x => x * x)
console.log(s)

const t = Container.of(null)
    .map(x => x.toUpperCase())
console.log(t)
// 输出 TypeError: Container.of is not a function
// 对于 输入值的null undefined的情况,可以使用MayBe函子
  • 函子总结

    • 函数式编程的运算不直接操作值,而是由函子完成

    • 函子就是一个实现了 map 契约的对象

    • 我们可以把函子想象成一个盒子,这个盒子里面封装了一个值

    • 想要处理盒子中的值,需要给盒子的map方法传递一个处理值的函数(纯函数),由这个函数来对值进行处理

    • 最终map返回一个包含了新值的盒子(函子)

  • MayBe 函子:我们在编程过程中可能会遇到很多错误,需要对这些错误做相应的处理,MayBe函子的作用就是可以对外部的空值情况做处理(控制副作用在允许的范围)

class MayBe {
    static of(value){
        return new MayBe(value)
    }
    constructor(value) {
        this._value = value
    }
    map(fn) {
        return this.isNoting() ? MayBe.of(null) : MayBe.of(fn(this._value))
    }
    isNoting() {
        return this._value === null || this._value === undefined
    }
}

const g = MayBe.of('Hello World').map(x => x.toUpperCase())
console.log(g)
// MayBe { _value: 'HELLO WORLD' }

const f = MayBe.of(null).map(x => x.toUpperCase())
console.log(f)
// MayBe { _value: null } 解决了输入是null的问题

const h = MayBe.of('Hello World')
    .map(x => x.toUpperCase())
    .map(x => null)
    .map(x => x.split(' '))
console.log(h)
// MayBe { _value: null } 不会报错,但是有问题,不知道哪个环节返回的null
  • Either函子:两者中的任何一个,类似于if...else...的处理,异常会让函数变得不纯,Either函子可以用来做异常处理
class Left {
    static of(value) {
        return new Left(value)
    }
    constructor(value) {
        this._value = value
    }
    map(fn) {
        return this
    }
}

class Right {
    static of(value) {
        return new Right(value)
    }
    constructor(value) {
        this._value = value
    }
    map(fn) {
        return Right.of(fn(this._value))
    }
}

let r1 = Right.of(12).map(x => x + 2)
let l1 = Left.of(12).map(x => x + 2)
console.log(r1)
console.log(l1)

function parseJSON (str) {
    try{
        return Right.of(JSON.parse(str))
    } catch (e) {
        return Left.of({ error: e.message })
    }
}
let r = parseJSON('{ "name": "Tom" }')
console.log(r)
// 输出为: Right { _value: { name: 'Tom' } }

let l = parseJSON('{ name: Tom }')
console.log(l)
// 输出为: Left { _value: { error: 'Unexpected token n in JSON at position 2' } }

let m = parseJSON('{ "name": "Tom" }').map( x => x.name.toUpperCase())
console.log(m)
// 输出为: Right { _value: 'TOM' }
  • IO函子

    • IO 函子中的_value是一个函数,这里是把函数作为值来处理

    • IO 函子可以把不纯的动作存储到_value中,延迟执行这个不纯的操作(惰性执行),包装当前的操作

    • 把不纯的操作交给调用者处理

const fp = require('lodash/fp')
class IO {
    static of(value) {
        return new IO(function (){
            return value
        })
    }
    constructor(fn) {
        this._value = fn
    }
    map(fn) {
        return new IO(fp.flowRight(fn, this._value))
    }
}

let r = IO.of(process).map(p => p.execPath)
console.log(r)
// IO { _value: [Function (anonymous)] }
console.log(r._value())
// D:\Program Files\nodejs\node.exe
  • Task 异步执行

    • 异步任务的实现过于复杂,我们使用 folktale 中的 Task 来演示

    • folktale 一个标准的函数式编程库

      • 和lodash、ramda不同的是,他没有提供很多功能函数

      • 只提供了一些函数式处理的操作,例如:compose、curry等,一些函子Task、Either、MayBe等

// folktale 中 compose, curry的用法
const { compose, curry } = require('folktale/core/lambda')
const { toUpper, first } = require('lodash/fp')

let f = curry(2, (x, y) => x + y)
console.log(f(1, 2))
console.log(f((1), 2))

let f1 = compose(toUpper, first)
console.log(f1(['one', 'two']))


  • Task 异步执行

    • folktale 2.x中的Task和1.0中的Task区别很大,这里演示2.3.2的用法
// Task 处理异步任务
const fs = require('fs')
const { task } = require('folktale/concurrency/task')
const { split, find } = require('lodash/fp')

function readFile(filename) {
    return task(resolver => {
        fs.readFile(filename, 'utf-8', (err, data) => {
            if(err) resolver.reject(err)
            resolver.resolve(data)
        })
    })
}
readFile('package.json')
    .map(split('\n'))
    .map(find(x => x.includes('version')))
    .run()
    .listen({
        onRejected: err => {
            console.log(err)
        },
        onResolved: value => {
            console.log(value)
        }
    })
  • Point 函子

    • Pointed 函子是实现了 of 静态方法的函子

    • of 方法是为了避免使用 new 来创建对象,更深层的含义是 of 方法用来把值放到上下文 Context(把值放到容器中,使用map来处理值)

  • IO函子的问题

// IO 函子的问题
const fp = require('lodash/fp')
const fs = require('fs')
class IO {
    static of(value) {
        return new IO(function (){
            return value
        })
    }
    constructor(fn) {
        this._value = fn
    }
    map(fn) {
        return new IO(fp.flowRight(fn, this._value))
    }
}
let readFile = function (filename) {
    return new IO(function (){
        return fs.readFileSync(filename, 'utf-8')
    })
}
let print = function (x) {
    return new IO(function(){
        console.log(x)
        return x
    })
}

let cat = fp.flowRight(print, readFile)
let r = cat('package.json') // IO(IO(x))
console.log(r) // IO { _value: [Function (anonymous)] }
console.log(r._value()._value()) // 嵌套函子取值,看起来很麻烦,下面用Monad函子解决
  • Monad(单子)

    • Monad 函子是可以变扁 Pointed函子,比如上个示例中的IO(IO(x))

    • 一个函子如果具有 join 和 of 两个方法并遵守一些定律就是一个 Monad

// 解决IO 函子的问题
const fp = require('lodash/fp')
const fs = require('fs')
class IO {
    static of(value) {
        return new IO(function (){
            return value
        })
    }
    constructor(fn) {
        this._value = fn
    }
    map(fn) {
        return new IO(fp.flowRight(fn, this._value))
    }
    // 增加join 方法,monad 函子
    join() {
        return this._value()
    }
    flatMap(fn){
        return this.map(fn).join()
    }
}
let readFile = function (filename) {
    return new IO(function (){
        return fs.readFileSync(filename, 'utf-8')
    })
}
let print = function (x) {
    return new IO(function(){
        console.log(x)
        return x
    })
}

// let cat = fp.flowRight(print, readFile)
// let r = cat('package.json') // IO(IO(x))
// console.log(r) // IO { _value: [Function (anonymous)] }
// console.log(r._value()._value()) // 嵌套函子取值,看起来很麻烦

// 改造后的调用
let r = readFile('package.json')
    // .map(x => x.toUpperCase())
    // .map(fp.toUpper)
    .flatMap(print)
    .join()
console.log(r)
posted @ 2022-12-03 09:46  菜菜123521  阅读(59)  评论(0编辑  收藏  举报