Javascript 这些出口的区别是什么？

我是个新手，我遇到过两段代码，我认为它们可以做同样的事情，但我不能完全确定

    import React from 'react'
    
    export default function TestComponent() {
        return (
            <div>
                
            </div>
        )
    }

从“React”导入React
导出默认函数TestComponent（）{
返回(
)
}

以及

    import React from 'react'

    function TestComponent() {
        return (
            <div>
                
            </div>
        )
    }
    
    export default TestComponent

从“React”导入React
函数TestComponent（）{
返回(
)
}
导出默认测试组件

---

我能看到两者之间的唯一区别是，导出只是放在其中一个的末尾，但如果我的理解是正确的，它们的行为应该是相同的。这对代码的行为有任何实际影响吗？

正如一些评论中所说，这两个代码块实际上是等效的（即，它们是相同的）。理论上，您可以添加代码以使它们不同（例如，在第二个示例中，您可以在导出函数之前重新分配函数）。。。但这将是相当做作的

这对代码的行为有实际影响吗

---

不需要。重要的是你要命名你导出的函数（事实上，如果你不命名，Create-React-App规则就会失败，因为这会使你的调试更加困难）。

两个代码块在功能上是相同的，但我个人倾向于第二个

两者都使用函数声明，但第二个声明允许您在不修改导出的情况下将声明替换为函数表达式或类声明

---

此外，如果您可以从一个文件进行多个导出，那么在文件底部声明默认导出是一种有用的约定。

在您的情况下也是如此，因为您使用“经典”Javascript函数创建React组件

我个人使用第一个代码来保存一行代码，但当您使用arrow函数编写React.js组件时，第二个代码很有用，如下所示：

const yourComponent = () => {};

export default yourComponent;

---

在这种情况下，您必须在文件末尾使用这一行：）

两者在技术上是相同的，唯一的区别是您添加了一个额外的行以在第二个代码中导出功能组件。我通常更喜欢第二个代码，因为与第一个代码相比，它可以保持我的代码干净。

总而言之，这不是React或组件的问题，而是一般的编码，尤其是JavaScript模块的问题

这可能是开发人员方面的可伸缩性问题，即如果代码增长，您自己将如何管理代码。如果您必须添加和维护更多函数/类/变量，将定义函数/类/变量的代码位置与定义要导出的函数/类/变量的代码位置以及定义默认导出的代码位置分开是一个好处，因为您只能有一个默认导出，但许多非默认导出—假设您决定重新声明哪个导出是默认导出，将新导出标记为“默认”，而忘记“取消标记”旧导出，然后在代码中的某个位置定义“默认”，旧默认可能会排除新导出，因为新导出在代码中的后面。在文件末尾声明导出将为您提供有用的概述

个人风格的问题可能是，如果您想在定义函数/类/变量时直接使用“导出”，以立即查看哪些函数/类/变量是“公共的”，哪些是“私有的”（即未导出）

如果您的代码需要某种类型的API，您可以使用导出为的选项，例如，在代码中维护复杂的“会说话”的函数名称，但通过“简单”的名称向组件的使用者公开功能。如果与函数本身的定义分开，这显然会更容易

一般来说，为了您自己的利益，请在这里尽可能明确：单独的“导出”说明。试图编写短而聪明的代码会导致比无数代码更复杂的问题。React和其他软硬件并没有给你留下深刻的印象，你可能有多么聪明，很少有东西会更快或更慢，因为，并试图概括

---

对于React For components所使用的JavaScript“ES6”模块，2015年的简介仍然是最好的参考资料，肯定是必读资料。

两者完全相同……这被称为

默认导出。导入时，您可以命名任何内容，如从“/TestComponent”导入TestC每个模块只能导出默认值一次。它们是一样的…就像生活中的很多事情一样…有不同的方法可以剥猫皮，最终得到相同的结果。react的样板文件使用了多少令人疯狂的功能？这是用
create react app
创建的吗？如果在模块内重新分配
TestComponent
。没人会这么做，所以没关系……为什么要用声明替换函数表达式？如果你这样做了，你必须改变语句…“如果你可以从一个文件中有多个导出”-更好的约定是在这种情况下命名你的导出：-）我主要使用函数表达式，因为TypeScript中的语法更友好，导出将保持不变。对我来说，更符合逻辑的是，在所有情况下，导出基本上都是“从该文件导出变量x”。您是对的，命名导出在大多数情况下更好，但是如果您正在开发重用组件，那么允许以任何名称导入它有时会很有帮助。我知道你可以用任何名称导入东西，但这与语法和开发人员的品味有关。你也可以在文件顶部使用
export{yourComponent as default}
：-）是：）我的回答只是回答他目前的情况。“旧的默认值可能会超过新的，因为代码中的时间较晚。”-不，是的