javascript - 如果在导入的模块中使用但在它们外部声明，是否存在两个常量发生命名空间冲突的风险？

Question

如果我有三个文件，基本上是这样的:

file_one.js:

const lol = () => {
    console.log('Laughing out loud in file_one')
}

const funcOne = () => {
    lol()
}

export default funcOne

file_two.js:

const lol = () => {
    console.log('Laughing out loud in file_two')
}

const funcTwo = () => {
    lol()
}

export default funcTwo

one_and_two_importer.js:

import funcOne from 'file_one'
import funcTwo from 'file_two'


funcOne()
funcTwo()

我的假设是函数 lol 将在全局范围内，从而导致命名空间冲突，但显然这并没有发生。此外，如果我尝试在 one_and_two_importer.js 中记录函数 lol，我会收到未定义的错误。

作为 documentation says , import 将模块插入到当前作用域，但是导入模块使用的常量在哪个作用域？

Answer 1

两个 lol 函数现在是 closures ，这意味着尽管它们仍然在每个 funcOne 和 funcTwo 函数中被调用，但它们是隐藏的，因为它们不可公开访问。

对于 ES6 模块(或 commonJS)，注入(inject)到本地命名空间的唯一名称是您显式导入的名称，例如在所有情况下

import x from 'y'
import { x } from 'y'
import * as x from 'y'

命名空间只会获取x的附加变量。没有其他变量以隐藏的方式注入(inject)。

您会发生冲突的唯一方法是，如果您要在两个文件中显式导出 lol 变量，然后尝试按其名称导入它。例如在两个文件中都有

export lol

然后

import { lol } from 'file_one'
import { lol } from 'file_two'

除非你尝试做这样的事情，否则这两个 lol 变量将被限定在它们各自的模块中，因此不会相互冲突。

我建议阅读更多关于 how closures work 的内容在 JavaScript 中。