JQuery 绑定 Ajax 成功

Question

为什么我们在AJAX success调用上调用 bind？

看看这段代码：

$.ajax({
    url: myurl,
    dataType: 'json',
    success: function(data){
        this.setState({data: data});
    }.bind(this)
});

如果我们不调用bind ，那么它有什么区别或者在这里使用bind有好处吗？

Answer 1

您需要调用bind()以强制您的回调上下文 ( this ) 是正确的。 否则，它默认在全局上下文中调用（显然，jQuery 使用 jqXHR 对象的上下文调用它）。 bind()设置你的函数到任何的背景下this应该是。

Answer 2

@shubham，这是在您的回调函数中使用当前 this 的JavaScript语法，正如您在以下内容中提到的：

success: function(data){
    this.setState({data: data});
}

bind()函数的第一个参数将在调用函数中充当 this，您应该通过apply()和call()函数，因为这对您有帮助。

Answer 3

我想你的代码来自React 。 因为最近我在处理React 时遇到了类似的问题。

回到你的问题。 我认为bind是发挥变换功能。 代码如下：

componentDidMount: function() {
var _this = this;
$.ajax({
  url: this.props.url,
  dataType: 'json',
  cache: false,
  success: function(data) {
    _this.setState({data: data});
  }
 });
},

等于：

componentDidMount: function() {
$.ajax({
  url: this.props.url,
  dataType: 'json',
  cache: false,
  success: function(data) {
    this.setState({data: data});
  }.bind(this)
 });
},

至于如此，我想你可以理解什么是bind函数以及为什么使用bind来实现它。