JavaScript中如何优雅处理对象的不存在函数调用并避免报错？

要实现调用对象上不存在的函数时不报错且无操作，最靠谱的方案是利用ES6的Proxy特性拦截属性访问；另外还有一个非标准钩子仅做了解即可。

推荐方案：使用Proxy代理对象 #

通过Proxy的get陷阱，我们可以在访问对象属性时做拦截：如果属性存在则正常返回，不存在则返回一个空函数，这样调用不存在的函数时就不会抛出is not a function异常。

示例代码：

// 假设原对象是Obj
const safeObj = new Proxy(Obj, {
  get(target, prop) {
    // 优先返回原对象已有的属性
    if (prop in target) {
      return target[prop];
    }
    // 不存在的属性返回空函数，避免调用报错
    return () => {};
  }
});

// 现在调用不存在的函数不会报错
safeObj.nonExistentFucntion1();
safeObj.nonExistentFucntion2();
safeObj.nonExistentFucntion3();

如果需要更精准的控制——比如只对函数调用做处理，非函数属性访问仍返回undefined，可以调整get逻辑：

const safeObj = new Proxy(Obj, {
  get(target, prop) {
    const value = target[prop];
    // 存在的函数直接返回，不存在则返回空函数
    return typeof value === 'function' ? value : () => {};
  }
});

非标准方案（仅Firefox支持） #

早期有一个__noSuchMethod__钩子，当调用对象上不存在的方法时会触发它，但这个特性从未被纳入标准，仅Firefox浏览器支持，不推荐生产环境使用：

Obj.__noSuchMethod__ = function() {};

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