如何进一步缩短这段JavaScript代码的实现?
简化柯里化函数的数组 map 调用
嘿,这个简化想法很有意思!咱们来一步步拆解怎么实现你想要的写法,同时搞清楚背后的逻辑~
原代码的问题点
首先看你原来的 parse 函数,它是柯里化的,但参数顺序是先接收 doc,再接收 callback:
const parse = (doc) => { return (callback) => { return callback(doc.data()) }; };
而 Array.map 会把数组里的每个元素(也就是 doc)传给它的回调函数,所以你原来的写法是:
users.map(doc => parse(doc)(user => console.log(user)))
本质上是把每个 doc 传给 parse,得到一个接收 callback 的函数,再立即调用这个函数并传入打印回调。
实现你想要的简化写法
你想要的 users.map(parse (user => console.log(user))) 这种形式,核心是让 parse 先接收 callback,返回一个能直接处理 doc 的函数(也就是符合 map 回调的函数)。
我们可以调整柯里化的参数顺序,写一个适配的高阶函数:
// 先接收 callback,再接收 doc const parseWithCallback = (callback) => (doc) => callback(doc.data());
现在就可以直接用你想要的形式调用了:
const person1 = { data: () => ({ name: 'Andrei' }) } const users = [person1]; users.map(parseWithCallback(user => console.log(user))); // 执行后会打印 { name: 'Andrei' }
为什么原想法直接用 parse(user => console.log(user)) 不行?
原 parse 的第一个参数期望是 doc(带有 data 方法的对象),如果你直接把 user => console.log(user) 传给 parse,那这个函数就会被当作 doc,之后返回的函数会等待另一个 callback,但 map 传递的是真正的 doc,这就完全不符合逻辑了,自然无法正常工作。
额外优化:复用原 parse 函数
如果你不想重新写一个函数,也可以通过函数组合把原 parse 倒过来用:
const wrapParse = (callback) => (doc) => parse(doc)(callback); // 用法和上面的 parseWithCallback 完全一样 users.map(wrapParse(user => console.log(user)));
内容的提问来源于stack exchange,提问作者Andrei Zgirvaci
相关产品推荐
相关产品推荐

