Why is there a function call in a useState() hook in React sometimes? And what does it mean?

Question

Take the following example.

const predefinedFonts = { Lato: [], Montserrat: [] };
const [fonts, setFonts] = useState(() => predefinedFonts);

From my best understanding, the result of fonts ends up just being predefinedFonts.

So what's the difference? useState could have just been this to begin with, with no arrow function.

const [fonts, setFonts] = useState(predefinedFonts);