Question

我想知道在全局声明变量时最佳做法是什么：如果我有CustomerID并且var foo = document.getElementById('bar')仅在被调用的函数内使用有一次，最好是foo在函数内部或外部声明（性能明智）？

如果在函数内声明了foo，那是否意味着每次函数运行时程序都必须在DOM树中搜索该元素？如果是这样，为什么在函数之外声明foo为何更好呢？

Answer 1

如果您在函数内使用foo，最好在本地使用它。因为这可以使您和其他人免于混淆。并且它将更具可读性。如果您在全局声明它，那么总是有可能误用变量。

Answer 2

应避免全球声明

作为开发人员，您的工作是尽可能地限制全局范围内可用的变量数量。 为什么？有几个原因，这些都是很好的理由。

可读性和直观性

其他开发人员不应该通过全球范围寻找他们需要的东西。通常，最佳做法是存储单个对象（ singleton ）。这意味着在该Object中应该组织属性和子对象（非常类似于文件系统），以便直观地确定某些功能和属性的位置。

可维护性

即使其他开发人员没有加入，您也需要在某种程度上维护此产品。如果是这种情况，那么在全球范围内将你的逻辑分开是很困难的，如果从现在起6个月后，你需要对某个部分进行一些修改只是为了得到某些东西，在其他地方中断。

浏览器支持

不太可能但不是那么重要，浏览器一直在添加功能，并且有许多规范设置用于众多功能，这些功能要么被提议，要么被测试，要么被实现。如果您的任何全局声明与他们发生冲突，您将很难在必须更改代码后重新连接所有内容。

那你该怎么办？

您应该在全局范围中创建单个对象或尽可能少的对象，然后通过扩展该单个对象来构建所需的功能和特性。这称为范围界定，它是发展的一个非常重要的部分。

对于您提供的案例而不是写作

var  foo = document.getElementById('bar');

function a() {
 // do Something with foo;
}

function b() {
  // do Something with foo;
}
a();
b();

你最好写

let MyApp = {
a: function() {
  //do Something with this.foo;
},
b: function() {
  //do something with this.foo;
}
}
myApp.foo = document.getElementById('bar')
myApp.a();
myApp.b();

全局声明DOM元素变量的效率

2 个答案: