jQuery中无法在函数内调用另一函数的问题求助

这个问题我太熟啦！你遇到的Uncaught ReferenceError: updateErrorMsg is not defined报错，核心原因是函数调用时的上下文（this指向）出错，咱们一步步理清楚：

为什么会报错？ #

你在init方法里用$(document).on("click", "#addEmployee", this.addEmployee)绑定事件时，当点击事件触发，addEmployee函数里的this会指向触发事件的DOM元素（也就是#addEmployee按钮），而不是你的employee实例。

而updateErrorMsg是定义在employee.prototype上的实例方法，必须通过employee实例才能调用。你直接写updateErrorMsg()会把它当成全局函数，自然找不到，所以抛出了引用错误。

三种修复方案 #

核心思路都是：确保调用updateErrorMsg时，上下文是你的employee实例，而不是DOM元素。

方案一：用箭头函数绑定上下文

箭头函数不会改变this的指向，会继承外层作用域的this（也就是employee实例）：

var employee = function() { this.init(); }; 
employee.prototype = { 
  init: function() { 
    // 用箭头函数包裹，保证this指向employee实例
    $(document).on("click", "#addEmployee", (e) => this.addEmployee(e)); 
  }, 
  updateErrorMsg: function() { alert('Error'); }, 
  addEmployee: function(e) { 
    this.updateErrorMsg(); // 现在this正确指向实例
  } 
}

方案二：用bind()强制绑定this

通过bind()方法，把employee实例强制绑定到addEmployee函数上：

var employee = function() { this.init(); }; 
employee.prototype = { 
  init: function() { 
    // 绑定this到addEmployee，确保事件触发时上下文正确
    $(document).on("click", "#addEmployee", this.addEmployee.bind(this)); 
  }, 
  updateErrorMsg: function() { alert('Error'); }, 
  addEmployee: function(e) { 
    this.updateErrorMsg(); // this指向employee实例
  } 
}

方案三：保存实例引用到变量

在init里把实例this存到变量（比如self），后续用这个变量调用方法：

var employee = function() { this.init(); }; 
employee.prototype = { 
  init: function() { 
    var self = this; // 保存实例引用
    $(document).on("click", "#addEmployee", function(e) {
      self.addEmployee(e); // 用self调用，保证上下文正确
    }); 
  }, 
  updateErrorMsg: function() { alert('Error'); }, 
  addEmployee: function(e) { 
    self.updateErrorMsg(); // 通过self调用实例方法
  } 
}

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