为什么`this`属性无法在函数中访问

Question

问题

我正在开发一个jQuery插件。用$.fn.bar()调用时，foo（）中的alert（）不会输出预期的结果。我在哪里犯错了？

(function($){

  var input;

  var foo = function(){
    alert(this.input); //<-- Not getting the desire input value
  }

  $.fn.bar = function(){

    this.input = "Test";

    alert(this.input); //<-- Output "Test" as expected
    foo(); //<-- Call foo(), expect to alert "Test" as well, but not

  };


}(jQuery));

解决方案

您需要使用this将bar()中的上下文foo()传递给foo.call(this)。

https://jsfiddle.net/clintonlam/de1vz59w/8/

Answer 1

您应该.call foo函数中在this中包含任何bar，以便将bar的调用上下文转移到{{1} }：

foo

var foo = function() {
  console.log('foo', this.input);
};
$.fn.bar = function() {
  this.input = "Test";
  console.log('bar', this.input);
  foo.call(this);
};

$().bar();