JavaScript如何定义无需每次传入外层参数outside的通用函数f？

解决方案：使用高阶函数封装f的创建逻辑 #

你可以把f改造成高阶函数，接收outside参数后返回一个已经绑定了该参数的实际执行函数，所有上层函数都可以通用这套逻辑，不需要再每次调用时传入outside。

调整后的函数定义 #

const createF = (outside) => {
  // 返回的函数已经固定了外层的outside参数
  return (param1, param2) => {
    outside(param1, param2);
  };
};

// 更简洁的箭头函数写法
// const createF = outside => (param1, param2) => outside(param1, param2)

上层函数调用示例 #

const g = (outside, param3, param4) => {
  // 在上层函数内初始化绑定当前outside的f实例
  const f = createF(outside);
  // 此处为其他业务代码
  f(var1, var2); // 不需要再传outside参数
  // 此处为其他业务代码
}

// 其他上层函数也可以通用
const h = (outside, otherParam) => {
  const f = createF(outside);
  f(var3, var4);
}

方案优势 #

• 完全通用，不局限于某一个上层函数，所有持有outside参数的上层函数都可以直接使用
• 无全局污染，不同上层函数生成的f实例互相独立，即使传入的outside不同也不会互相干扰
• 类型友好，TypeScript 下可以直接正常推导参数类型，不需要额外的类型适配

如果你不想额外封装高阶函数，也可以直接使用原生的Function.prototype.bind方法绑定第一个参数：在上层函数内执行const f = f.bind(null, outside)，后续调用f(var1, var2)同样不需要传outside。不过封装高阶函数的可读性和可扩展性更强，后续要给f加公共逻辑只需要修改一次创建逻辑即可。

内容的提问来源于stack exchange，提问作者Ghost