JavaScript Academy · 课时

无点风格

Q: 「无点风格」这节课中我会学到什么？

组合函数而不命名参数。 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

组合函数而不命名参数。

无点风格 是 CoddyKit 上的免费 JavaScript Academy 课时。这是第 4 节课，共 4 节。你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。这是 JavaScript Academy 学习路径的一部分，你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 4 节课。

什么是无点风格

无点风格（也称隐式风格）通过组合其他函数来定义函数，无需提及参数。参数就是沿着流程隐式传递的“点”。

function double(n) { return n * 2; }
const nums = [1, 2, 3];
// pointed: argument named explicitly
console.log(nums.map((n) => double(n))); // [2, 4, 6]
// point-free: no named argument
console.log(nums.map(double));            // [2, 4, 6]

直接传递函数

当回调函数只是将参数转交给另一个函数时，您可以直接按名称传递该函数，而不必将它包装起来。

const len = (s) => s.length;
const words = ["a", "bb", "ccc"];
console.log(words.map((w) => w.length)); // pointed: [1, 2, 3]
console.log(words.map(len));             // point-free: [1, 2, 3]

函数 composition

无点式代码依赖composition：将一个函数的输出传给下一个函数，从而构建新函数。

const compose = (f, g) => (x) => f(g(x));
const inc = (n) => n + 1;
const double = (n) => n * 2;
const incThenDouble = compose(double, inc);
console.log(incThenDouble(3)); // (3+1)*2 = 8

pipe 辅助函数

pipe 从左到右读取，许多人认为这比 compose 更清晰。它会按顺序应用函数。

const pipe = (...fns) => (x) => fns.reduce((acc, f) => f(acc), x);
const inc = (n) => n + 1;
const double = (n) => n * 2;
const f = pipe(inc, double);
console.log(f(3)); // 8

构建流水线

借助 pipe，您可以将多步骤转换表示为一个命名函数，同时完全不必命名数据。

const pipe = (...fns) => (x) => fns.reduce((a, f) => f(a), x);
const trim = (s) => s.trim();
const lower = (s) => s.toLowerCase();
const clean = pipe(trim, lower);
console.log(clean("  HELLO  ")); // "hello"

柯里化支持无点风格

柯里化会将多参数函数转换为一连串单参数函数，从而生成可以直接组合的一元函数。

const multiply = (a) => (b) => a * b;
const triple = multiply(3);
console.log([1, 2, 3].map(triple)); // [3, 6, 9]

部分应用

预先固定部分参数，可以得到一个专用函数，并将其直接传递出去；这也是实现无点代码的一种方式。

const add = (a, b) => a + b;
const add10 = add.bind(null, 10);
console.log([1, 2, 3].map(add10)); // [11, 12, 13]

组合谓词

您可以从已有函数构建布尔辅助函数，从而编写简洁的无点式过滤代码，避免在行内堆积箭头函数。

const isEven = (n) => n % 2 === 0;
const negate = (fn) => (x) => !fn(x);
const isOdd = negate(isEven);
console.log([1, 2, 3, 4].filter(isOdd)); // [1, 3]

可读性方面的权衡

无点风格可能很优雅，但过度使用会变得晦涩难懂。当它能明确表达意图时再使用（map(double)）；如果命名参数有助于理解，就保留参数。

const names = ["ada", "bob"];
console.log(names.map((n) => n.toUpperCase())); // ["ADA","BOB"]

方法引用的陷阱

按名称传递方法可能会丢失它的 this。当函数依赖对象上下文时，请将它包装起来或对它进行绑定。

const calc = {
  factor: 2,
  scale(n) { return n * this.factor; }
};
console.log([1, 2].map(calc.scale.bind(calc))); // [2, 4]

组合实际转换

将这些内容结合起来：把小型命名函数组合成流水线，就能实现声明式、可测试且无点式的数据流。

const pipe = (...fns) => (x) => fns.reduce((a, f) => f(a), x);
const toNums = (arr) => arr.map(Number);
const onlyPos = (arr) => arr.filter((n) => n > 0);
const sum = (arr) => arr.reduce((a, n) => a + n, 0);
const process = pipe(toNums, onlyPos, sum);
console.log(process(["3", "-1", "4"])); // 7

快速检查

无点风格。

回顾

无点风格通过组合其他函数来构建函数，而不命名参数。请通过引用传递函数（map(double)），使用 compose/pipe 进行组合，并通过柯里化或部分应用创建一元函数。请注意方法引用可能丢失 this；如果保留参数能让代码更清晰，就应当保留。

常见问题解答

「无点风格」课时是免费的吗？

是的 — 「无点风格」的完整文本可在网页上免费阅读。要进行交互式练习（内置代码编辑器和全天候 AI 导师）并解锁 JavaScript Academy 课程的其余内容，请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 4 节课。

「无点风格」这节课中我会学到什么？

组合函数而不命名参数。你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy，全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 JavaScript Academy 需要有经验吗？

无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者，你可以从这里开始或从头开始，按照自己的节奏学习。这是第 4 节课，共 4 节。

「无点风格」课时需要多长时间？

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动，所以你能稳步进步，并在网页和应用中从离开的地方继续。

我能在这节 JavaScript Academy 课中编写并运行代码吗？

能。每节 JavaScript Academy 课都包含内置代码编辑器，你可以在浏览器中直接编写并运行真实代码，并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

← 返回 JavaScript Academy