为什么我们需要在 React Native 中绑定函数?

IT技术 javascript reactjs react-native
2021-03-29 06:18:07

我正在做一个 React Native 项目。在一些教程中,我看到绑定这样的方法:

constructor(props){
super(props);
this.my_function = this.my_function.bind(this);
}

我的问题是,如果我可以使用构造函数访问该函数,this.my_function那么为什么我需要再次绑定它?我有 Java 和 Python 背景,这可能就是我对这种类型的方法绑定感到困惑的原因。注意:我知道如果我不在 React Native/React JS 中绑定方法,我的方法将无法正常工作。我只想知道为什么我需要这个额外的绑定。

4个回答

查看此链接以了解 JS 闭包的工作原理

http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/

您需要绑定函数,以便它可以访问类中的状态和其他变量,而不仅仅是执行时传递的参数。

很好的答案和你给出的很好的参考 - 在阅读这篇文章后,我明白类函数中的默认“this”指的是函数本身,绑定函数将它覆盖到对象
2021-06-22 06:18:07

那么你需要绑定this到类的方法。这样您就可以访问方法主体中 obj 的副本。

this如果这样调用,特殊参数将自动在方法体中可用。

obj.my_function();

在这种情况下,obj 被传递给this参数,您可以使用.obj访问它的所有方法和属性obj.propertyName

但是在您的情况下,您的类方法my_function很可能会因某事的事件而被调用。您需要将类的实例与此示例绑定。

希望能帮助到你。

我强烈建议您阅读此资源以更好地理解。之前的回答中也提到过。

恕我直言,这完全是关于 javascript 中的范围和上下文。深入了解 javascript 中作用域的工作原理,可以让您构建更强大的应用程序和更清晰的代码。

基本上,bind 允许您将函数绑定到给定的上下文。它允许您访问存储在特定范围中的值,在 ReactJs 中通常是构造函数范围。

您也可以阅读这篇文章,这是一篇很棒的文章,回顾了 bind 方法。

http://reactkungfu.com/2015/07/why-and-how-to-bind-methods-in-your-react-component-classes/

另请参阅此讨论,也许对您有用:

https://stackoverflow.com/a/38334183/9638302

您将在 react 中使用 es6 类,因此类将拥有自己的方法和变量。所有这些方法都将可用this,如果一个方法想要访问另一个无法访问的类方法thisthis我们需要访问bind(this)该方法。

如果你很懒惰,那么你可以使用自动绑定的箭头函数this

class helloWorld extends Component {
     foo = () => {
        console.log(this);
     }
}