Mozilla 扩展：变量范围答案

【问题标题】：Mozilla Extensions: Variable ScopesMozilla 扩展：变量范围
【发布时间】：2020-02-03 21:03:34
【问题描述】：

AFAIK，内容脚本中的所有顶级变量在窗口中必须是全局唯一的。因此，如果两个内容脚本都包含let port = ...; 之类的行，它们将破坏扩展名。这种行为使关注点分离变得非常困难，因为如果将功能分组到目录和文件中，您将混淆哪些变量名仍然可以使用。有没有规范的方法可以避免这个问题？

这是一个最小的例子：

manifest.json

{
  "manifest_version": 2,
  "name": "test",  
  "version": "1.0",

  "applications": {
    "gecko": {
      "id": "test_script@example.com"
    }
  },

  "content_scripts": [
    {
      "matches": ["*://*.google.com/*"],
      "js": ["read/index.js", "write/index.js"]
    }
  ] 
}

读取/index.js

console.log("i am read");

写/index.js

console.log("i am write");

加载 Google 页面时，“我正在阅读”和“我正在写”将打印到控制台。但是，如果我们对内容脚本做一些小的改动会怎样：

读取/index.js

let message = "i am read";
console.log(message);

写/index.js

let message = "i am write";
console.log(message);

现在只会打印“我被读”了。

【问题讨论】：

你想完成什么？它可能不是的语言。你认为你错在哪里？
请注意，如果那些脚本文件只包含函数，这不是问题。因为使用let 或const 初始化的变量只属于它所在的块的范围。这将是函数中的。

标签： javascript scope firefox-addon separation-of-concerns

【解决方案1】：

我很傻。谢谢 LukStorms 的回答：我只需将脚本文件中的代码包装在一个函数中即可设置适当的范围。我想我已经有一段时间没有用 JavaScript 编码了......

据我所知，有两种常见的包装代码的方法：

(() => {
  code here...
})()

和

function main() {
  code here...
}
main();

【讨论】：