30 90秒

Question

$(document).ready(function(){
  var someVar = $("non_existing_element");
});

在浏览器控制台中

> $("non_existing_element");
[]

BUT

> someVar
ReferenceError: someVar is not defined

为什么这样实现？如果调用someVar也返回[]或者至少两个调用都返回相同的内容，那会更有意义吗？

Answer 1

关于变量范围的

$(document).ready(function(){
  var someVar = $("non_existing_element");
});

此时，someVar确实等于[]。所以，如果你要写：

$(document).ready(function(){
  var someVar = $("non_existing_element");
  console.log("the value of someVar is", someVar);
});

你会在你的控制台中看到

someVar的值是[]

万岁！

但是！

一旦你传递了最后一个大括号......

$(document).ready(function(){
  var someVar = $("non_existing_element");
}); // <<<<< This one

您有离开function() {}定义的功能。请注意，它没有名称，因此称为匿名函数。别担心，它没有反对政治或经济的仇杀。

离开函数后，无法再访问使用var定义的变量。这是为了防止范围泄漏，这是一个完整的其他对话，我相信你很快就会知道。尝试在没有var的情况下定义它。走着瞧吧。

不使用var将允许变量逃脱可怜的匿名函数的离合器，并在全局范围内废弃自己。（顺便说一句，可通过window.global_variable）

访问

因此，当您在控制台中键入变量时（如果您使用breakpoints则不适用），从您的全局范围读取变量，因为您 in 之内功能。而且由于我们刚刚发现var将变量限定为您不在的函数，我们现在知道它为什么未定义。

我的意思是，想象一下只能有一个名为checkbox的变量！您放入的每个Javascript插件都会相互冲突。没有人会知道checkbox是什么，在您知道之前，您的DOM中都会发生疯狂的事情。

故事的道德：范围你的变量。了解你的变量。喜欢你的变数。