Javascript 什么'；useState（函数名）、useState（函数名（））、useState（（）=>；函数名（））和useState（（）=>；函数名（）之间的区别是什么？

函数

createHiveBackground

返回要分配给状态的对象数组。稍后在我的应用程序中，我将使用

setHive

更改数组的一些值。这两者有什么区别

const [hive, setHive] = React.useState(createHiveBackground);
const [hive, setHive] = React.useState(createHiveBackground());
const [hive, setHive] = React.useState(()=>createHiveBackground);
const [hive, setHive] = React.useState(()=>createHiveBackground());

如果我使用

useState（createHiveBackground）

它似乎工作正常

如果每次使用setHive更改值时都使用

useState（createHiveBackground（））

，则会再次调用该函数

如果我使用

useState（（）=>createHiveBackground）

TypeError:hive.map不是一个函数（似乎该函数没有被执行）

如果我使用

React.useState（（）=>createHiveBackground（））它似乎工作正常

一些人能否澄清所有这些选项之间的区别以及对我的情况来说什么是最好的？
区别在于：


值类型：函数/数组（函数的返回类型）
初始类型：Normal/Lazy

参考资料：





这甚至不是关于react的问题，这是简单的js基础知识。我要解释另一个主题，事件函数调用

document.addEventListener('change',(createHiveBackground));
document.addEventListener('change', (event)=>createHiveBackground(anotherParam));

上述两个操作的作用相同，但唯一的区别是在函数处理的第一行中编码
createHiveBackground
的方式拥有传入的参数
function createHiveBackground（event，anotherArg）{}
因为父函数addEventListener在两种情况下都将事件作为参数传递给上述函数的第一个参数

但是在第二种情况下，您编码了只需要一个参数的函数
函数createHiveBackground（anotherArg）{}
，并且避免了addEventListener和createHiveBackground之间的冲突，因此在中间使用了函数

你的另一句话是关于它的区别：

const [hive, setHive] = React.useState(createHiveBackground());

您的createHiveBackground是这样写的：

function createHiveBackground() {return data}

提供React.useState waiting等待的数据。这将立即执行func。
但这在任何时候都不起作用

document.addEventListener('change', createHiveBackground())

因为它将在没有触发事件的情况下在“编译”中正确执行。一个异常是它可能返回另一个函数，该函数将在事件触发时调用

function createHiveBackground(){ return function(event, anotherParam){doSomeStuff on event}

最后一个示例只是传递一个函数体，稍后可能会调用该函数体
（）=>createHiveBackground
不会立即调用它

回到您的问题，React.useState需要一些数据-您可以根据createHiveBackground函数实现使用其中任何一个（上面的同事说：

//first two similar and used at lazy call
const [hive, setHive] = React.useState(createHiveBackground);
const [hive, setHive] = React.useState(()=>createHiveBackground());

//the next must return a data to be passed to the state
const [hive, setHive] = React.useState(createHiveBackground());

//nothing will happened because the function body will be passed but not executed
//function's body will be stored at the state
const [hive, setHive] = React.useState(()=>createHiveBackground);

确保你知道什么是a（那里没有火箭科学）——也就是说，你需要熟悉这个语法。然后阅读这些语句并理解它们之间的区别就有点简单了，再结合官方文档（见丹尼斯的回答）...“编译”？我想，有一个更好的措辞。比如“立即，即使没有触发事件”。@user6537157如果您认为我的帖子的措辞可能更好，您可以自己编辑我的帖子，这就是为什么我将“compile”一词放在括号中的原因，我知道编译在JSF中没有任何共同的含义。最后一个示例分配了一个函数，它可以被称为hive（），它不会抛出您应该检查的异常it@DennisVash当然，你是对的，如果我们需要将函数体存储在状态
//first two similar and used at lazy call
const [hive, setHive] = React.useState(createHiveBackground);
const [hive, setHive] = React.useState(()=>createHiveBackground());

//the next must return a data to be passed to the state
const [hive, setHive] = React.useState(createHiveBackground());

//nothing will happened because the function body will be passed but not executed
//function's body will be stored at the state
const [hive, setHive] = React.useState(()=>createHiveBackground);