跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客我的书AI学习GitHub 精选镜像AI 生图工具UI配色美学关于
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
JavaScript大前端算法

函数柯里化

函数柯里化通过将多参数函数转换为一系列单参数函数,实现分步接收参数并统一处理。示例展示了基础数值累加的柯里化逻辑,以及在 React 组件中利用该模式处理表单数据变更事件,达到参数复用和解耦的目的。

道系青年发布于 2021/5/4更新于 2026/9/1175 浏览
函数柯里化

函数柯里化

概念

通过函数调用继续返回函数的方式,实现多次接收参数最后统一处理的函数编码形式。

代码示例

基础示例

function sum(a) {
  return (b) => {
    return (c) => {
      return a + b + c;
    };
  };
}

React 应用示例

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="app"></div>
  <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
  <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
  <script type="text/babel">
    class Demo extends React.Component {
      state = { username: "", password: "" }

      saveFormData = dataType => {
        return event => this.setState({
          [dataType]: event.target.value
        })
      }

      handleSubmit = event => {
        event.preventDefault();
        const { username, password } = this.state;
        console.log("你输入的用户名是:" + username + ", 密码是:" + password);
      }

      render() {
        return (
          <form onSubmit={this.handleSubmit}>
            用户名:<input type="text" name="username" onChange={this.saveFormData("username")}/>
            密码:<input type="text" name="password" onChange={this.saveFormData("password")}/>
            <button>提交</button>
          </form>
        )
      }
    }
    ReactDOM.render(<Demo />, document.getElementById("app"))
  </script>
</body>
</html>

目录

  1. 函数柯里化
  2. 概念
  3. 代码示例
  4. 基础示例
  5. React 应用示例

更多推荐文章

查看全部
  • Claude Code 源码泄露事故分析:Source Map 配置失误导致 51 万行代码公开
  • HDFS 核心机制:文件分块与分布式存储原理
  • 企业微信群机器人发送 Markdown 消息及表格支持
  • C++ 输入输出优化:关闭流同步 cin、cout 详解
  • 从零开始使用 IsaacLab 训练机器人行走
  • AI 写作的发展趋势与展望
  • RocketMQ Java 生态消息中间件实战详解
  • LLaMA-Factory 详细安装教程
  • ZU47DR RFdc Linux 驱动编译与使用指南
  • llama.cpp:本地大模型推理的高性能 C++ 框架
  • Whisper-turbo 速度实测:云端 GPU 7 倍加速
  • window.print 打印内容被截断?解决 HTML 实际高度打印问题
  • 《Agent Runtime 工程化》第七章 权限与安全边界:7.6 审批记录是系统事实
  • Stable Diffusion 写真生成完整教程
  • Dify 与 MySQL 集成实战:基于 MCP 协议的数据交互方案
  • AI API 中转平台选型指南:5 家主流服务对比实测
  • Flink 批计算单词统计示例
  • RTX 4090 加速国产 AIGC 视频生成:腾讯混元与阿里通义万相
  • Python 库 addict 使用指南:字典属性化访问
  • 县域烟花禁燃监管 GIS 实践:基于 Java 与高德地图的销售点盘点

相关免费在线工具

  • 加密/解密文本

    使用加密算法(如AES、TripleDES、Rabbit或RC4)加密和解密文本明文。 在线工具,加密/解密文本在线工具,online

  • Gemini 图片去水印

    基于开源反向 Alpha 混合算法去除 Gemini/Nano Banana 图片水印,支持批量处理与下载。 在线工具,Gemini 图片去水印在线工具,online

  • Keycode 信息

    查找任何按下的键的javascript键代码、代码、位置和修饰符。 在线工具,Keycode 信息在线工具,online

  • Escape 与 Native 编解码

    JavaScript 字符串转义/反转义;Java 风格 \uXXXX(Native2Ascii)编码与解码。 在线工具,Escape 与 Native 编解码在线工具,online

  • JavaScript / HTML 格式化

    使用 Prettier 在浏览器内格式化 JavaScript 或 HTML 片段。 在线工具,JavaScript / HTML 格式化在线工具,online

  • JavaScript 压缩与混淆

    Terser 压缩、变量名混淆,或 javascript-obfuscator 高强度混淆(体积会增大)。 在线工具,JavaScript 压缩与混淆在线工具,online