如何实现支持链式调用、无参时返回拼接字符串的fx函数

题目要求 #

• 函数支持链式调用，调用形式为fx(字符串).fx(字符串)...fx()
• 每次传入字符串参数时留存拼接内容
• 最终无参数调用时，返回所有留存内容以空格分隔的完整字符串
• 给定测试用例fx("append").fx("me").fx()执行输出为append me

完整实现代码 #

function fx (value) {
    // 闭包维护当前调用链的字符串收集数组，不同调用链数据互不干扰
    const collected = [];

    // 核心链式处理函数
    function chain(val) {
        // 无入参时返回最终拼接结果
        if (val === undefined) {
            return collected.join(' ');
        }
        // 有入参时存入收集数组
        collected.push(val);
        // 返回带fx方法的对象，支撑后续链式调用
        return { fx: chain };
    }

    // 处理首次调用传入的参数
    return chain(value);
}

// 测试用例
console.log(
    fx("append").fx("me").fx()
)
// 输出：append me

实现逻辑说明 #

• 利用闭包特性，每次调用外层fx时都会创建独立的collected数组，避免多个调用链之间的数据互相污染
• 内部chain函数负责统一处理所有调用逻辑：
  • 无参数调用时，直接将收集到的所有字符串用空格拼接后返回
  • 有参数调用时，先把参数存入收集数组，再返回挂载了fx属性的对象，fx属性指向chain本身，保证后续可以继续通过.fx(xxx)的形式链式调用
• 外层fx首次执行时，直接把初始入参传给chain处理，完成第一次参数收集和链式对象返回

内容的提问来源于stack exchange，提问作者Ahmed Rauf Khan