前端学习之函数式编程—纯函数(代码片段)

萌萌的DDD 萌萌的DDD     2022-12-17     754

关键词:

Part 01 纯函数概念

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

  • 纯函数就类似数学中的函数,用来描述输入与输出之间的关系,例如:y=f(x)

Part 02 案例:slice和splice函数 

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

  • splice 返回数组中的指定部分,不会改变原数组
  • splice 对数组进行操作,返回该数组,会改变原数组

 

// 纯函数 和 不纯函数
// slice 和 splice 


let arr = [1, 2, 3, 4]

// 纯函数 多次调用返回相同内容
console.log(arr.slice(0, 2)); //[ 1, 2 ]
console.log(arr.slice(0, 2)); //[ 1, 2 ]
console.log(arr.slice(0, 2)); //[ 1, 2 ]

// 不纯函数 splice 会修改原数组  因此多次调用返回的结果不相同

console.log(arr.splice(0, 2)); //[ 1, 2 ]
console.log(arr.splice(0, 2)); //[ 3, 4 ]
console.log(arr.splice(0, 2)); //[]
// 纯函数案例

function getSum(num1, num2) 
    return num1 + num2


console.log(getSum(1, 2)); // 3
console.log(getSum(1, 2)); // 3
console.log(getSum(1, 2)); // 3

根据相同的输入,始终获得了相同的输出,因此称为纯函数

  • 函数式编程不会保留计算中间的结果,所以变量是不可变的
  • 我们可以把一个函数的执行结果交给另一个函数去处理

Part 03  Lodash 一致性、模块化、高性能的 JavaScript 工具库

安装lodash

//安装 lodash (node 方法)
const _ = require('lodash');
const _ = require('lodash/core');
const fp = require('lodash/fp');
const array = require('lodash/array');
const object = require('lodash/fp/object');
const at = require('lodash/at');
const curryN = require('lodash/fp/curryN');

// 安装lodash (npm)

// npm init -y
// npm i lodash
const arr = ['jack', 'tony', 'ethen', 'soap']

console.log(_.first(arr)); // jack
console.log(_.last(arr)); // soap
console.log(_.toUpper(_.first(arr))); // JACK
console.log(_.reverse(arr)); //[ 'soap', 'ethen', 'tony', 'jack' ]
const r = _.each(arr, (item, index, arr) => 
    console.log(item);
)
console.log(r); //['jack', 'tony', 'ethen', 'soap'] 数组本身

Part 04 纯函数的优势

  1. 可缓存 

        因为纯函数对相同的输入始终有相同的结果,所以可以把函数的结果缓存起来

        如果结果值相同,多次调用只会执行一次,但仍然会获取值

// 记忆函数
const _ = require('lodash');

function getAxios(params) 
    console.log(params);
    return params * 10 * 10 * 10 * 10


const getAreaWithMemory = _.memoize(getAxios)
console.log(getAreaWithMemory(4)); 
console.log(getAreaWithMemory(4));
console.log(getAreaWithMemory(5));
console.log(getAreaWithMemory(5));

// 模拟 memoize 方法的实现

function memoize(fn) 
    let cache = 
    return function() 
        let key = JSON.stringify(arguments)
        cache[key] = cache[key] || f.apply(f, arguments)
        return cache[key]
    

 2.可测试

        纯函数让测试更方便(单元测试)

3.并行处理

  •   在多线程环境下并行操作共享的内存数据很可能会出现意外的情况\\
  •   纯函数不需要访问共享的内存数据,所以在并行环境下可以任意运行纯函数(webWorker)

Part 05 副作用

// 不纯函数

let mini = 18 

function checkAge(age)
    return age >= mini

当函数如果依赖外部的变量或状态,就无法保障输出相同的结果,如果外部变量被修改,则会带来副作用

副作用来源:"

  • 配置文件
  • 数据库
  • 用户的输入
  • 等等

前端学习之函数式编程—函数组合(代码片段)

Part01函数组合纯函数和柯里化很容易写出洋葱代码=====>h(g(f(x)))一层一层套起来不宜阅读例如:获取数组最后的一个元素再转大写字母_.toUpper(_.first(_.reverse(array)))函数组合可以让我们把细粒度的函数重新组成... 查看详情

前端学习之函数式编程—函数式编程概念+头等函数(代码片段)

什么是函数式编程函数式编程(functionprogrammingFP)FP是编程范式之一,我们常听说的还有,面向过程编程,面向对象编程函数式编程的思维方式把现实世界的事物和事物之间的联系抽象到程序世界(对运算... 查看详情

前端学习之函数式编程—高阶函数(代码片段)

 什么是高阶函数(Higher-orderfunction)    可以把函数作为参数传递给另一个函数    可以把函数作为另一个函数的返回结果Part1可以把函数作为参数传递给另一个函数实现forEach函数//高阶函数-函数作为参数functionforEach(array,fn)for(... 查看详情

前端学习之函数式编程—闭包(代码片段)

闭包Part01闭包的概念闭包(closure):函数和其周围的状态(词法环境)的引用捆绑在一起形成闭包. 可以在另一个作用域中调用一个函数的内部函数并访问到该函数作用域中的成员//函数作为返回值functionmakeFn()letmsg='hellofunction'... 查看详情

scala学习之函数式风格编程(代码片段)

FUNCTIONALPROGRAMMINGhttps://docs.scala-lang.org/overviews/scala-book/functional-programming.htmlScala允许您以面向对象编程(OOP)风格、函数式编程(FP)风格甚至混合风格编写代码,结合使用这两种方法。本书假设您是从Java、C++或C#等OOP语言来... 查看详情

swift函数式编程八(纯函数式数据结构)(代码片段)

代码地址纯函数式数据结构(PurelyFunctionalDataStructures)指的是那些具有不变性的高效的数据结构。二叉搜索树使用indirect关键字将二叉树定义为一个递归枚举:indirectenumBinarySearchTree<Element:Equatable>caseleafcasenode(BinarySearchTree<... 查看详情

swift函数式编程八(纯函数式数据结构)(代码片段)

代码地址纯函数式数据结构(PurelyFunctionalDataStructures)指的是那些具有不变性的高效的数据结构。二叉搜索树使用indirect关键字将二叉树定义为一个递归枚举:indirectenumBinarySearchTree<Element:Equatable>caseleafcasenode(BinarySearchTree<... 查看详情

前端学习函数式编程的方法和误区(代码片段)

函数式编程思想,前端同学的必选项。函数式编程是一门古老的技术,从上个世纪60年代Lisp语言诞生开始,各种方言层出不穷。各种方言带来欣欣向荣的生态的同时,也给兼容性带来很大麻烦。于是更种标准化工... 查看详情

函数式编程:纯函数&柯里化&组合函数(代码片段)

函数式编程:纯函数&柯里化&组合函数纯函数函数的柯里化组合函数纯函数相同的输入值,产生相同的输出在函数的执行过程中,不能产生副作用。不能对传入的参数进行修改,不依赖上层作用域内的数据。... 查看详情

玩转javascript面试:何为函数式编程?(代码片段)

函数式编程在JavaScript领域着实已经成为一个热门话题。就在几年前,很多JavaScript程序员甚至都不知道啥是函数式编程,但是就在近三年里我看到过的每一个大型应用的代码库中都包含了函数式编程思想的大规模使用。函数式编... 查看详情

函数式编程--为什么要学习函数式编程?(代码片段)

函数式编程(FunctionalProgramming,FP)什么是函数式编程?通过纯函数来实现一些细粒度的函数,然后把这些细粒度的函数组合成功能更强大的函数,这一过程就是函数式编程,经典函数式编程库:lodash函数式编程是编程范式之一,... 查看详情

什么是函数式编程?(代码片段)

 纯函数:定义:对于相同的输入永远会得到相同的输出,而且没有任何可以观察的副作用,也不依赖外部的环境状态。 例如数学公式:y=f(x)在javascript中,对于数组的操作,有的是纯的,有的是不存的,如:letarr=[1,2,3,4,5... 查看详情

前端开发函数式编程入门(代码片段)

前端开发函数式编程入门函数式编程是一门古老的技术,从上个世纪60年代Lisp语言诞生开始,各种方言层出不穷。各种方言带来欣欣向荣的生态的同时,也给兼容性带来很大麻烦。于是更种标准化工作也在不断根据现... 查看详情

函数式编程中如何处理副作用?(代码片段)

函数式编程中如何处理副作用?阅读(2,381) 评论(0) Functional_Programming2018-10-28一.纯函数纯函数是说没有副作用的函数(afunctionthathasnosideeffects),有几个好处:引用透明(referentialtransparency)可推理(reasonaboutyourcode)P.S.关... 查看详情

php函数式编程(代码片段)

什么是函数式编程与面向对象编程(Object-orientedprogramming)和过程式编程(Proceduralprogramming)并列的编程范式。最主要的特征是,函数是第一等公民。强调将计算过程分解成可复用的函数,典型例子就是map方法和reduce方法组合而... 查看详情

编程范式——函数式编程入门(代码片段)

该系列会有3篇文章,分别介绍什么是函数式编程、剖析函数式编程库、以及函数式编程在React中的应用,欢迎关注我的blog命令式编程和声明式编程拿泡茶这个事例进行区分命令式编程和声明式编程命令式编程1.烧开水(为第一人... 查看详情

swift函数式编程八(纯函数式数据结构)(代码片段)

代码地址纯函数式数据结构(PurelyFunctionalDataStructures)指的是那些具有不变性的高效的数据结构。二叉搜索树使用indirect关键字将二叉树定义为一个递归枚举:indirectenumBinarySearchTree<Element:Equatable>caseleafcasenode(BinarySearchTree<... 查看详情

scala函数式编程(代码片段)

Scala函数式编程什么是函数式编程?1、函数式编程将计算视为数学上的函数计算2、函数成为了和普通的值一样的"头等公民",可以像任何其他数据类型的值一样被传递和操作函数式编程成为越来越流行的编程范式1... 查看详情