函数式编程

今天看react基础知识的有看到一个知识点:react是什么?

我心下想就是一个js库用来解决UI层面的问题嘛,再往下看有什么特点,脑袋里想的就是组件化啊,单向数据流之类的,然后看到了一个东西,就是他是遵循声明式编程的;

我心里很奇怪,虽然也可以理解,但是我在做项目的时候总是会下意识的以为react是函数式编程..因为实现功能总要写hooks以及一些方法,这些都是函数,所以就想着了解一下这个函数式编程是啥;

函数式编程是什么?

函数式编程和声明式,命令式都属于编程范式,不同的是函数式和声明式都只关心要做什么,不关心怎么做,命令式则是关心怎么做;

简要解释一下:
比如妈妈需要让你去商店买包盐

命令式:需要妈妈(程序员)告诉怎么去买,走那条路,骑不骑车等要素,然后买到盐

声明式、函数式:只要把盐买回来就可以,你骑火箭来回我都不关心

函数式编程本质

本质就是一个表达式,也就是遵循函数式编程的程序本质上就是一个表达式,即我输入1,经过一顿运算,会给我返回一个值;无论调用多少次,只要输入的值不变,输出的值也一定不变;

这里让我想起了一个定义,就是纯函数:

纯函数的定义就是固定的输入会带来固定的输出,且没有副作用;

函数式编程特点

  • 函数是一等公民
  • 函数是纯函数

为啥函数是一等公民?一等公民是啥?

首先解释一等公民,即函数和其他数据类型都处于平等地位,可以赋值给其他变量,这里可以参考TypeScript当中的类型(never,any,number)关系,既可以作为函数调用,也可以作为参数传给另一个函数,也可以返回别的类型的值,也就是直接return其他类型,所以函数可以说是万能的,什么数据类型都可以变化

什么是纯函数捏

上面说了纯函数的定义,相同输入会带来相同的输出,没有副作用

第一条很好理解,第二条没有副作用看起来很奇怪,这个也是药物么,有副作用啥的?

副作用指不影响外部环境,也就是只关注于函数自身的变化,不去改变其他函数和变量维护的值;

常见的副作用为修改全局变量的值、操作DOM节点等

举个栗子

function add(str){
    return x + 10
}

很简单吧,这个就是函数式编程的实例,符合上方描述的函数式编程的所有特征;

函数柯里化

这个东西对于小白来说可能很难立即(比如我),先说一下他的定义

函数柯里化有成为部分求值,柯里化的函数会接收一些参数,但是并不会全部处理,而是继续返回另一个参数,这样就形成了一个闭包,返回的函数可以接收到上级作用域留存下的所有参数,然后如果这个函数还需要柯里化,可以继续返回函数,再去形成新的闭包,根据作用域链访问原则,最外层接收的所有参数都可以被访问到

特性:

  • 接收单一参数
  • 返回接收余下参数而且返回结果的新函数

举个栗子

function sumCurry(a) {
    return function(b) {
        return a + b;
    }
}
console.log(sumCurry(2)(2));

这就是一个标准的函数柯里化

如果很难理解的话可以看一下这个

function sumCurry(a,b) {
    return function() {
        return a + b;
    }
}
console.log(sumCurry(2,2));

他俩是一样的,但是第二种并不属于函数柯里化,因为他接收了两个参数

分析一下函数柯里化,就是先拿到第一个值,他的返回值是另一个函数,这个函数去接收第二个值,完成运算;

为啥需要函数柯里化

看上面的例子,我直接接收两个参数,一起运算返回多好,我甚至都不需要返回一个函数,直接返回最后的结果都可以,但是往往有许多业务场景,这个传入的参数并不能作为最后运算的值,需要一层层的处理,最后才能得到正确的值,这样看其实函数柯里化是用更复杂的结构来换取了更高的自由度;

不用行不行

这个取决于具体的场景,就像上面的例子,我定义局部变量去接收处理,最后返回的值一样可以实现效果,总的来说,没必要为了柯里化而柯里化,只要能解决问题,怎么做都可以,学习函数柯里化的原因只是为了某些场景可以用到,在优化的时候也可以使用这种思路去优化;

高阶函数

高阶函数又是啥

有两个条件:

  • 接收函数作为参数
  • 返回值为一个函数

满足其中一个就可以称为高阶函数,在我开发react项目的时候,高阶函数其实是随处可见的,所以了解这个东西很重要;

为啥需要高阶函数

其一,把函数当作参数传递,这代表我们可以抽离出一部分容易变化的业务逻辑,把这部分业务逻辑放在函数参数中,这样一来可以分离业务代码中变化与不变的部分。其中一个重要应用场景就是常见的回调函数。

其二,让函数继续返回一个可执行的函数,意味着运算过程是可延续的

总结

总结这个东西的目的就是这些东西都很像(自我认为),其次就是不想在开发过程当中迷迷糊糊的去使用这些东西,我想知道为什么要这么做,这是什么东西,有什么优点,又怎么优化,这些东西我感觉对于开发而言并不只是知识点,也是自己技术的基石,是十分重要的部分

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
React是一个用于构建用户界面的JavaScript库。它采用了组件化的开发方式,使得开发者可以将界面拆分成独立的、可复用的组件。在React中,函数式编程是一种常见的编程范式,它强调使用纯函数来构建应用。 函数式编程是一种编程范式,它将计算视为数学函数的求值过程。在函数式编程中,函数被视为一等公民,可以作为参数传递给其他函数,也可以作为返回值返回。函数式编程强调不可变性和无副作用,即函数的执行不会改变外部状态。 在React中,函数式编程被广泛应用于组件的开发。使用函数式编程的方式,我们可以将组件定义为纯函数,接收一些输入参数(称为props),并返回一个描述组件界面的React元素。这种方式使得组件的开发更加简洁、可测试和可维护。 函数式编程在React中的一些特点包括: 1. 纯函数:组件函数应该是纯函数,即相同的输入应该始终产生相同的输出,而且不应该有副作用。 2. 无状态组件:函数式组件通常是无状态的,即它们不会保存任何状态信息,只依赖于传入的props进行渲染。 3. 高阶组件:函数式编程可以使用高阶组件(Higher-Order Components)来增强组件的功能,例如添加共享的逻辑或状态管理。 总结一下,React中的函数式编程是一种将组件定义为纯函数的开发方式,它强调不可变性和无副作用,使得组件的开发更加简洁、可测试和可维护。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值