reactjs - React Native 组件中的函数(函数与 const 函数)

Question

这可能非常简单，但我不太清楚如何搜索答案。

我刚刚注意到我的 React Native 组件中有一些函数，有时我用 const 声明，而另一些则不声明，而且似乎没有区别。

像这样

const MyComponent = (props) => {
 
     const myFunction = () => {
        console.log("Hello world");
     }
     return(
         <TouchableOpacity onPress={myFunction}>
            ...somestuff
         </TouchableOpacity>
     )
}

或

const MyComponent = (props) => {
 
     myFunction = () => {
        console.log("Hello world");
     }
     return(
         <TouchableOpacity onPress={myFunction}>
            ...somestuff
         </TouchableOpacity>
     )
}

就输出而言，我找不到它们之间有什么不同。这只是编译器保存了我的 a*s 还是它们之间实际上有区别？

Answer 1

我认为在 React Native 中它并不重要，因为它的生命周期。但在普通的 javascript 中，它在提升方面有所不同。如果没有 const，您可以调用尚未声明的函数:

doTheThing();


function doTheThing() {
   console.log(`This is awesome number ${getAwesome()}`)
}

function getAwesome() {
  return (+((Math.random() * 10000).toString().split('.')[0]))
}

使用 Const/let 它不允许你这样做:

 const tryDoTheThing = () => {
    console.log(`This is me trying to be awesome ${getAwesome()}`)
 }


 // "getAwesome is not defined", because it is referenced too early
 tryDoTheThing() // comment to see the rest work


 const getAwesome = () => (+((Math.random() * 10000).toString().split('.')[0]))


 const doTheThing = () => {
   console.log(`This is awesome! ${getAwesome()}`)
 }

 doTheThing() // prints

using function 会将其声明放在当前作用域的顶部(当前脚本或当前函数的顶部)。