柯里化

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

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

✅ 使用柯里化(参数复用

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

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 小时前
React 之死·终章:一个 useRef,把闭包陷阱、依赖数组、漫天 rerender 全送走
前端·react.js·ai编程
不好听6132 小时前
HTML 事件监听机制:从 DOM Level 0 到 React 合成事件
前端·react.js·html
wordbaby2 小时前
为什么刷新页面就 404?聊聊 SPA 路由与 Nginx 的那点事
前端
不好听6132 小时前
React 核心概念:JSX、组件与数据驱动
前端·react.js
触底反弹2 小时前
🔥 React 零基础入门(中):500 行屎山代码到组件化的蜕变
前端·javascript·react.js
不好听6132 小时前
React vs Vue:两大前端框架技术选型深度对比
前端·vue.js·react.js
GuWenyue2 小时前
Cursor黑盒拆解!1套LangChain.js手写Mini编程Agent,自动生成React项目,效率提升60%
前端·数据库·人工智能
GuWenyue2 小时前
传统Agent工具两大痛点!300行代码落地MCP跨语言工具,彻底解耦LLM与工具
前端·人工智能·算法
小林ixn3 小时前
从 onclick 到 React 合成事件,再到完整应用逻辑:一次前端架构的深度剖析
前端·react.js·前端框架
Csvn4 小时前
🧩「找不到模块」排查全记录——Monorepo 下 TypeScript 路径别名的 5 种「不通」与根治方案
前端