Javascript全局变量var与不var的区别深入解析

在JavaScript中，全局变量是在整个程序中都可访问的变量。在声明全局变量时，我们可以使用var关键字或者省略var关键字。然而，这两种方式之间存在一些重要的区别。

使用var声明全局变量

当使用var关键字声明一个变量时，它将成为全局对象的属性。在浏览器环境中，全局对象是window对象。这意味着使用var声明的全局变量可以通过全局对象访问。

示例1：

var globalVar = 10;

console.log(globalVar); // 输出: 10
console.log(window.globalVar); // 输出: 10

在上面的示例中，我们使用var声明了一个全局变量globalVar。我们可以直接访问globalVar，也可以通过window.globalVar访问。

不使用var声明全局变量

如果在声明变量时省略了var关键字，该变量也会成为全局变量。然而，这种方式会导致一些潜在的问题。

示例2：

function foo() {
  globalVar = 20;
}

foo();

console.log(globalVar); // 输出: 20
console.log(window.globalVar); // 输出: 20

在上面的示例中，我们在函数foo中直接给一个变量globalVar赋值，而没有使用var关键字。这将导致globalVar成为全局变量。我们可以在函数外部访问globalVar，也可以通过window.globalVar访问。

然而，不使用var声明全局变量存在一些潜在的问题：

1. 变量提升（Hoisting）：使用var声明的变量会在其作用域内进行变量提升，即在变量声明之前就可以访问变量。而不使用var声明的全局变量不会进行变量提升，只有在赋值语句执行后才能访问。

示例3：

console.log(globalVar); // 输出: undefined

var globalVar = 30;

console.log(globalVar); // 输出: 30

在上面的示例中，使用var声明的全局变量globalVar在变量提升后可以访问，但其值为undefined。而不使用var声明的全局变量在变量提升后无法访问。

1. 命名冲突：不使用var声明全局变量可能导致命名冲突。如果多个脚本文件中都使用了相同的全局变量名，那么它们将共享同一个全局变量，可能会导致意外的结果。

为了避免这些问题，建议始终使用var关键字来声明全局变量。

希望这个攻略对你有所帮助！