柯里化生产者函数

[非官方测试版翻译]

本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。发现错误？报告问题 →

egghead.io lesson 6: Simplify code by using curried _reduce_

将函数作为第一个参数传递给 produce 会创建一个尚未将 produce 应用于特定状态的函数，而是创建一个函数，该函数将在未来将 produce 应用于传递给它的任何状态。这通常被称为 柯里化。请看以下示例：

import {produce} from "immer"

function toggleTodo(state, id) {
    return produce(state, draft => {
        const todo = draft.find(todo => todo.id === id)
        todo.done = !todo.done
    })
}

const baseState = [
    {
        id: "JavaScript",
        title: "Learn TypeScript",
        done: true
    },
    {
        id: "Immer",
        title: "Try Immer",
        done: false
    }
]

const nextState = toggleTodo(baseState, "Immer")

上述 toggleTodo 的模式非常典型：将现有状态传递给 produce，修改 draft，然后返回结果。由于 state 除了传递给 produce 之外没有其他用途，因此可以使用 produce 的 柯里化 形式来简化上述示例。在这种形式中，你只需将 recipe 函数传递给 produce，produce 会返回一个新函数，该函数会将 recipe 应用于基础状态。这样我们就可以缩短上述 toggleTodo 的定义。

import {produce} from "immer"

// curried producer:
const toggleTodo = produce((draft, id) => {
    const todo = draft.find(todo => todo.id === id)
    todo.done = !todo.done
})

const baseState = [
    /* as is */
]

const nextState = toggleTodo(baseState, "Immer")

注意，id 参数现在已成为 recipe 函数的一部分！这种柯里化生产者函数的模式与例如 React 的 useState 钩子结合得非常紧密，我们将在下一页看到。