全局变量和局部变量

下面我们通过代码演示全局变量和局部变量的区别，具体代码如下。

// 全局作用域

var num = 10;    // 全局变量

function fn() {

 // 局部作用域

 var num = 20;   // 局部变量

 console.log(num); // 输出局部变量num的值，输出结果：20

}

fn();

console.log(num);  // 输出全局变量10的值，输出结果：10

在上述代码中，全局变量num和局部变量num虽然名称相同，但是它们互不影响，在fn()函数外获取的num的值为10，在fn()函数内获取到的num的值为20。

需要注意的是，函数中的变量如果省略var关键字，它会自动向上级作用域查找变量，一直找到全局作用域为止。示例代码如下。

function fn() {

 num2 = 20;

}

fn();

console.log(num2);  // 输出结果：20

在上述代码中，fn()函数中的“num2 = 20;”首先会在fn()函数的局部作用域中查找是否存在num2变量，如果不存在，则到上级作用域，也就是全局作用域中查找。由于在全局作用域中也没有num2变量，此时就会在全局作用域下创建一个全局变量num2。

通过以上对比可以看出，在全局作用域下，添加或省略var关键字都可以声明全局变量；而在函数中，添加var关键字声明的变量是局部变量，省略var关键字时，如果变量在当前作用域下不存在，会自动向上级作用域查找变量。局部变量只能在函数内部使用，函数的形参也属于局部变量。从执行效率来说，全局变量在浏览器关闭页面的时候才会销毁，比较占用内存资源，而局部变量在函数执行完成后就会销毁，比较节约内存资源。