javascript中错误使用var造成undefined

在JavaScript的世界中，变量根据其作用范围被分为全局变量和局部变量。全局变量，顾名思义，是全局可访问的，可以在任何脚本中调用。而局部变量则限定在特定的函数内部，函数之外无法访问。当我们在函数内部使用 `var` 关键字定义变量时，有时会出现意料之外的 `undefined` 错误。让我们深入了解这一现象。

想象一下这样一个简单的HTML页面，其中包含了三个按钮，每个按钮点击后会执行一个不同的JavaScript函数：test1、test2和test3。这些函数展示了全局变量和局部变量如何相互作用，以及如何因错误使用 `var` 而导致 `undefined` 错误。

我们定义了一个全局变量 `a` 并赋值为 "全局变量"。然后，在三个函数中，我们分别尝试访问和修改这个变量。如果我们不谨慎使用 `var` 关键字，会发生什么呢？

在 test1 函数中，我们使用 `var` 定义了一个局部变量 `a` 并赋值为 "局部变量"。当我们尝试弹出这个变量的值时，显示的当然是 "局部变量"。这是因为局部变量会覆盖全局变量。

在 test2 函数中，我们首先在未使用 `var` 的情况下尝试访问全局变量 `a`。由于函数内部没有找到名为 `a` 的局部变量，它应该返回全局变量的值 "全局变量"。随后我们又用 `var` 定义了一个局部变量 `a` 并赋值为 "局部变量"。如果我们再次尝试访问 `a`，它将返回 "局部变量"，而不是我们期望的 "全局变量"。这是因为在JavaScript中，如果我们在函数内部使用 `var` 定义一个变量，即使该变量名与全局变量相同，它也会被当作一个新的局部变量。而在未使用 `var` 的情况下访问变量时，JavaScript会先在当前的上下文中搜索该变量是否存在。如果不存在，它才会去查找全局变量。在第二次尝试访问 `a` 时，由于已经有了同名的局部变量，所以返回了 `undefined`。

而在 test3 函数中，无论是否使用 `var`，我们访问的都是全局变量 `a`。首先输出的是 "全局变量"，然后我们对全局变量 `a` 赋值为 "局部变量"，再次输出时显示的是 "局部变量"。

错误地使用 `var` 关键字会导致我们预期之外的 `undefined` 错误。在使用JavaScript时，我们必须谨慎选择何时以及如何使用 `var` 关键字来定义变量，以避免此类问题。正确的做法是在需要定义新的局部变量时使用 `let` 或 `const`（取决于你是否打算重新分配该变量的值），而不是盲目地使用 `var`。这样可以帮助我们避免不必要的错误和混淆。