Question

我们都知道我们需要在React中绑定函数以使其起作用。我知道为什么我们需要绑定它。

但是我不确定为什么我们不需要绑定箭头功能。

示例：使用箭头功能（无需绑定）

handleClick = () => {
  this.setState({
    isToggleOn: !this.state.isToggleOn
  });

};

现在，使用功能（需要绑定）

this.handleClick = this.handleClick.bind(this);

handleClick() {
  this.setState({
    isToggleOn: !this.state.isToggleOn
  });

};

我不是在问为什么我们需要绑定函数。我只想知道为什么箭头功能不需要绑定。

谢谢。

Answer 1

仅因为arrow函数的上下文中没有以下内容：

这个
参数
超级
new.target

因此，当您在箭头函数中引用此变量时，会将 this 视为任何其他变量，并首先在其作用域中查找其声明，但找不到它，因此它搜索上限范围 this 指所需的react组件类，因此我们无需将 this 绑定到该类。

Answer 2

引用MDN：

箭头函数表达式的语法比函数短表达式，并且没有自己的Private Sub btnRemove_Click(sender As Object, e As EventArgs) Handles btnRemove.Click lstOrder.Items.RemoveAt(lstOrder.SelectedIndex) If lstOrder.Items.Count < 5 Then btnAdd.Visible = True End If **If CInt(lstOrder.Text.Substring(0, 1)) <= 7 Then** regcount = regcount - 1 Else gmtcount = gmtcount - 1 End If End Sub，this，arguments或 super。这些函数表达式最适合非方法函数，它们不能用作构造函数。

进一步

直到箭头函数，每个新函数都定义了自己的new.target值（根据函数的调用方式，在构造函数的情况下为新对象，在严格模式函数调用中未定义，如果函数为基础对象，则为基础对象被称为“对象方法”等）。事实证明，采用面向对象的编程风格并不理想。

所以基本上，我们不需要绑定的原因是因为箭头函数的上下文中不存在this。因此，它上升到下一个级别，并使用在那里找到的this。

为什么我们不需要在React中绑定箭头功能？

2 个答案: