JavaScript——函数式编程Functor(函子)

简介: JavaScript——函数式编程Functor(函子)

前言

学习笔记输出~

内容

Functor(函子)

什么是函子

容器: 包含值和值的变形关系(函数)

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

代码演示

代码

代码改造

函数式编程思想避免直接看到new操作,所以对new进行封装

class Container {
   
    static of(value) { 
        return new Container(value)
    }
    
    constructor(value) { 
        this._value = value
    }
    map(fn) { 
        return Container.of(fn(this._value))
    }
}
let r = Container.of(4).map(x => x++).map(x => x * x)
console.log(r)
// => Container { _value: 16 }

总结

  • 函数式编程的运算不直接操作值,而是由函子完成
  • 函子就是一个实现了map契约的对象
  • 我们可以把函子想象成一个盒子,盒子里封装了一个值
  • 想要处理盒子中的值,我们要给盒子的map方法传递一个处理值得函数(纯函数),由这个函数对值进行处理
  • 最终map方法返回一个包含新值得盒子(函子)

MayBe

MayBe函子的作用就是可以对外部的空值情况做处理(控制副作用在允许的范围)

class MayBe { 
    static of(value) { 
        return new MayBe(value)
    }
    constructor(value) { 
        this._value = value
    }
    map(fn) { 
        return this.isNothing() ? MayBe.of(null) : MayBe.of(this._value)
    }
    isNothing() { 
        return this._value === null || this._value === undefined
    }
}
let r = MayBe.of(null).map(x => x.toUpperCase())
console.log(r)

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 r2 = Left.of(12).map(x => x + 2)
// console.log(r1, r2)
function parseJSON (str) { 
    try {
        return Right.of(JSON.parse(str))
     } catch (e) { 
        return Left.of({error: e.message})
    }
}
let r1 = parseJSON('{name: ts}')
console.log(r1)
let r2 = parseJSON('{"name": "ts"}').map(x => x.name.toUpperCase())
console.log(r2)

IO

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

IO函子可以把不纯的动作存储到_value中,延迟执行这个不纯的操作(惰性执行),保证当前的操作都是纯函数

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

const fp = require('lodash/fp')
class IO { 
    static of(value) {
        return new IO(function () { 
            return value
        })
     }
    constructor(value) { 
        this._value = value
    }
    map(fn) { 
        return new IO(fp.flowRight(fn, this._value))
    } 
}
let r = IO.of(process).map(p => p.execPath)
// console.log(r)
console.log(r._value())

Task

https://folktale.origamitower.com/

Task函子可以帮我们控制副作用进行异常处理,还可以处理异步任务,因为异步任务会带来回调地狱问题,使用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)
        }
    })

Pointed

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

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

class Container {
   
    static of(value) { 
        // 返回的结果就是上下文
        return new Container(value)
    }
    ......
}
let r = Container.of(4)
          .map(x => x++) // 在上下文上处理数据

Monad

Monad函子是可以解决函子嵌套(如: IO(IO(x)))的Pointed函子

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

const fp = require('lodash/fp')
const fs = require('fs')
const { log } = require('console')
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() { 
        return this._value()
    }
    flatMap(fn) { 
        return this.map(fn).join()
    }
}
let readFile = fileName => { 
    return new IO(() => { 
        return fs.readFileSync(fileName, 'utf-8')
    })
}
let print = x => { 
    return new IO(() => { 
        console.log(x)
        return x
    })
}
let r = readFile('package.json')
    .map(fp.toUpper)
    .flatMap(print)
    .join()
console.log(r);

学无止境,谦卑而行.

目录
相关文章
|
Web App开发 JavaScript 前端开发
为什么用 JavaScript 学习函数式编程?(软件编写)(第二部分)
本文讲的是为什么用 JavaScript 学习函数式编程?(软件编写)(第二部分),忘掉你认为知道的关于 JavaScript 的一切,用初学者的眼光去看待它。为了帮助你做到这一点,我们将会从头复习一下 JavaScript 的基础,就像你与其尚未谋面一样。
5673 0
|
4月前
JS+CSS3文章内容背景黑白切换源码
JS+CSS3文章内容背景黑白切换源码是一款基于JS+CSS3制作的简单网页文章文字内容背景颜色黑白切换效果。
38 0
|
4月前
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
56 1
JavaScript中的原型 保姆级文章一文搞懂
|
7月前
|
JavaScript 前端开发
JS:一篇文章带你搞懂什么是异步
JS:一篇文章带你搞懂什么是异步
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
213 5
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp宿舍管理系统的附带文章源码部署视频讲解等
116 3
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的家政平台附带文章源码部署视频讲解等
99 3
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
147 2
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
113 4
|
8月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物医院系统附带文章源码部署视频讲解等
86 2

热门文章

最新文章