我正在学习native react并学习更多关于javascript的知识，所以我仍然不了解它的行为。我已经创建了一个按钮组件，使用TouchableOpacity和它的道具onPress。为了让它发挥作用，我必须发送我想执行的功能作为道具，但由于我的经验不足，我在这里摔倒了。
我正在发送一个console.log，当我按下按钮时它就会被激活。因此，我直接在我定义的props中传递了console.log，但当我单击按钮时它不起作用，而是在初始化代码时执行的。另一方面，当我传递了一个包含console.log的箭头函数时，它已在单击按钮时执行。
为了更清楚，我将显示我的代码：
这是我的按钮组件：
const Button = ({ onUserPress, children, color }) => {
const state = {
};
return (
<TouchableOpacity onPress={ onUserPress } style={styles.buttonStyle} >
<Text style={styles.textStyle}>
{children}
</Text>
</TouchableOpacity>
);
};
我这样称呼他们：
<Button onUserPress={ console.log("hello") }>Something</Button>
这是在初始化我的应用程序时执行的，按下按钮时不会发生任何事情。
另一方面，当我使用相同的组件，但我传递console.log箭头函数时，如下所示：
<Button onUserPress={ ()=>{console.log("hello")} }>Something</Button>
这只会在我按下按钮组件时执行控制台日志。
有人能向我解释一下为什么行为不同吗？函数编程的世界对我来说是全新的，这些东西对我来说似乎很奇怪。根据我的理解，两者都是函数，所以对我来说它们没有什么区别(显然，从我无知的角度来看)。行为不同的原因是什么？
您不是在比较"正常函数"和箭头函数。
{和}之间的内容是一个表达式，对其进行求值并将结果分配给道具。
因此，您调用console.log("hello")，获取返回值，并将其作为函数分配给onUserPress(这毫无意义，因为console.log的返回值不是函数)。
不是函数：
console.log("hello");如果不想使用箭头函数，则需要传递一个常规函数：onUserPress={ function(){console.log("hello")}。
此外，您可以传递onUserPress={console.log}，在这种情况下，console.log将接收一个事件对象作为参数。
function(){console.log("hello")和() => console.log("hello")的不同之处在于，在第二种情况下"this"将指向您的组件
1-> <Button onUserPress={ console.log("hello") }>Something</Button>
2-> <Button onUserPress={ () => console.log("hello") }>Something</Button>
首先：您正在调用console.log("你好")，在第二个例子中，您返回console.log("你好")
所以它类似于
const函数调用=()=>{做点什么。。。}
const x = document.getElementById("root") x.addEventListener("click",functionCall()) <--- WRONG!!!在上述情况下，它将调用该功能，甚至在您按下输入/按钮；称为"；在第二个参数内。
相反
x.addEventListener("点击"，functionCall)<----纠正它执行点击按钮/输入时的功能