柯里化

函数柯里化的含义:将多个参数的函数 转化成 一个一个传入参数的函数。

目的:函数参数复用延迟执行 它使用闭包记住之前传递的参数。

✅ 使用柯里化(参数复用

我们将函数改造一下,让它先接收"规则",返回一个专门检查这个规则的函数。

js 复制代码
// 柯里化:第一层接收规则,第二层接收内容
function curriedCheck(reg) {
    // 闭包记住了 reg
    return function(txt) {
        return reg.test(txt);
    }
}

// 1. 参数复用:我们先生成一个"专门检查手机号"的函数// 这里我们将 reg 参数固定(复用)在了 checkPhone 函数内部
const checkPhone = curriedCheck(/^1\d{10}$/);

// 2. 以后使用,只需要传内容,不需要再传正则了
checkPhone('13800000001'); // true
checkPhone('13800000002'); // true
checkPhone('13800000003'); // true// 甚至可以再生成一个"专门检查邮箱"的函数const checkEmail = curriedCheck(/@/);
checkEmail('abc@qq.com');

结论: 在这里,正则表达式这个参数被复用 了。checkPhone 就像是一个被填入了一半参数的模具,你只需要填入剩下的一半即可。

延迟执行

onClickreact 渲染的时候就会 直接求值执行

react在渲染时,onclick会执行{}中的函数。 如果 onclick={handlerDelete(id)} 那么在渲染的时候直接就执行了这个函数,还没有点击就删除了。

所以使用匿名函数 or 柯里化

匿名函数 onclick={()=> handlerDelete(id)}

柯里化:

相关推荐
小陈工2 小时前
Python Web开发入门(十七):Vue.js与Python后端集成——让前后端真正“握手言和“
开发语言·前端·javascript·数据库·vue.js·人工智能·python
xiaotao1317 小时前
第九章:Vite API 参考手册
前端·vite·前端打包
午安~婉7 小时前
Electron桌面应用聊天(续)
前端·javascript·electron
彧翎Pro7 小时前
基于 RO1 noetic 配置 robosense Helios 32(速腾) & xsense mti 300
前端·jvm
小码哥_常7 小时前
解锁系统设置新姿势:Activity嵌入全解析
前端
之歆8 小时前
前端存储方案对比:Cookie-Session-LocalStorage-IndexedDB
前端
哟哟耶耶8 小时前
vue3-单文件组件css功能(:deep,:slotted,:global,useCssModule,v-bind)
前端·javascript·css
是罐装可乐8 小时前
深入理解“句柄(Handle)“:从浏览器安全到文件系统访问
前端·javascript·安全
华科易迅8 小时前
Vue如何集成封装Axios
前端·javascript·vue.js
康一夏8 小时前
Next.js 13变化有多大?
前端·react·nextjs