JS ES6：声明const并将其导出为默认值与将其直接声明为默认导出之间的区别

Posted 2021-04-08

在声明常量并将其导出为默认值或将其直接声明为默认导出之间，性能方面是否存在差异？第二个产生更清晰的代码，但我不确定它是否与第一种情况完全一样，或者每次从导入时从另一个文件请求它时都会创建它。

例如，这段代码：

const myValue = { … }
export default myValue

与这一个：

export default { … }

或者使用函数相同：

const myFunction = (a) => { … }
export default myFunction

和：

export default (a) => { … }

答案

如果您的实现完全符合ES6模块规范，则会产生很大的不同。模块导出绑定，而不是引用。这在这里解释：

https://ponyfoo.com/articles/es6-modules-in-depth#bindings-not-values

在（几乎）所有其他方面，javascript纯粹使用引用。变量是指向内存中实际数据的指针。将一个变量复制到另一个变量会复制指针，而不是值。为变量分配新值会创建新的数据块并将变量的指针移动到新数据，旧数据将被垃圾收集。有一种常见的误解，即基元通过引用按值传递给函数和对象;它们实际上都是通过引用传递的，并且原语似乎是通过值传递的，因为它们是不可变的 - 更改原语会丢弃旧值以支持新值，而不是原位更改原始值。

但是，绑定是相同的变量。如果您导出某些内容，则导出IT，而不是对其的引用。如果稍后在原始模块中更改导出的值，则此更改将反映在使用它的模块中。更糟糕的是，如果另一个模块更改了绑定，它会反映回原始模块和所有其他消耗模块。

如果您使用的是第三方模块导入程序或汇总工具，则可能无法获得此行为，因为在引擎本身之外进行复制非常困难。因此，您可能不会在未来数月或数年内看到这种影响，但将来会出现问题。

因此，最好的做法是始终出口常数，以防止任何令人讨厌的意外。

另一答案

首先，请记住const适用于特定变量。它可以防止为该变量分配不同的值。价值本身不是const。 const方面仅适用于声明为const的变量本身以及它所拥有的值。因此，在您的示例中，它仅适用于该模块中的实际myValue变量，而不适用于变量中的任何值。

所以，有了这个：

const myValue = { … }
export default myValue

它是myValue变量（不是它的值）是const和const方面意味着你不能分配与myValue变量不同的东西。如果将相同的值复制到不同的非const变量，则可以自由地将所需的任何内容分配给该其他变量。

当您导出该变量的值时，它将被分配给另一个变量（在任何导入它的变量中）并且不是const，除非它也被声明为const。此模块中的const对导入它的某些其他模块中的某些其他变量没有任何影响。

您可以逻辑地将导出和导入类似的这种类型视为将值赋值给另一个变量（在导入模块中）：

// exported value
const myValue = { … };        // exporting makes it available so others can import it

// imported value
let importedValue = myValue;  // importing assigns the exported value to a new variable

// further assignment
importedValue = "foo";        // this is allowed because importedValue is not 
                              // declared as const

并且，正如我认为你已经意识到的那样，myValue的常数根本不会使importedValue const。它包含myValue中的任何内容的副本，importedValue可以分配您想要的任何其他值。它没有宣布const本身所以它不是const。

在声明常量并将其导出为默认值或将其直接声明为默认导出之间，性能方面是否存在差异？

导出值没有区别，因为值本身不是Javascript中的const，只是变量。区别仅在于声明为const的局部变量，而导入模块无法访问它，这对导入模块没有任何影响。

或者使用一个函数相同

变量的值是什么（函数，对象，原始等等）并不重要。所有类型都是一样的。如果变量声明为const，则无法为该变量分配不同的值。但是，如果将该值复制到另一个未声明为const的变量，则可以进一步将所需的任何内容分配给该非const变量。它是const的变量，而不是值。您可以将const视为声明只读变量。