Javascript中的变量作用域

Javascript中的变量作用域

一、概念

在JavaScript中，变量可以是全局的，也可以是局部的。我们讨论它们之间的区别其实就是在讨论它的作用域（scope）。

• 全局变量（global variable）可以在 JavaScript 脚本中的任何一处被引用
• 局部变量（local variable）只存在于声明它的函数或代码块的内部，外部的函数或任何语句无法引用或改变它

二、代码示例

下面用一个计算平方的函数来说明这个概念：

声明一个全局变量 total，将要讨论的是这个全局变量和局部变量对这个 total 的值产生的影响。

var total = 50;

定义一个函数 square(num)，用于计算参数 num 的平方，注意此时的 total 在函数里是一个全局变量。

function(num) {
    total = num * num;
    return total;
}

将 square 函数的结果放在变量 result 里，运行看看结果。

var total = 50;
function square(num) {
    total = num * num;
    return total;
}
// 声明一个变量 result 来接收 square(20) 的返回值
var result = square(20);
console.log("total: " + total );
console.log("result: " + result );
---------------------------------
运行结果：
total: 400
result: 400

可以注意到，此时 total 的值被改变了，从50变成了400。虽然我们正确地拿到了 square 函数的返回值 result ，但 total 的值也发生了改变，这不是我们希望看到的。在实际的开发中，我们往往希望函数里的变量只在函数代码块里起作用，避免引起外部变量的变动。

将全局变量 total 改为局部变量，看看效果如何，直接上代码

var total = 50;
function square(num) {
	// 在这里重新声明了 total，表示 total 是函数 square 中的局部变量
    var total = num * num;
    return total;
}
// 声明一个变量 result 来接收 square(20)的返回值
var result = square(20);
console.log("total: " + total );
console.log("result: " + result );
---------------------------------
运行结果：
total: 50
result: 400

这一次在调用 square 函数后，在拿到结果的同时全局变量 total 的值并没有发生变化，这意味着全局变量 total 变得安全了，这正是我们希望看到的。

三、总结

Javascript 函数中，它在行为方面应该自给自足，尽量将函数内部的变量声明为局部变量，这样能避免非常多变量冲突的问题。

作者：Jackhu
来源：博客园
原文链接：https://www.cnblogs.com/jackhu6/p/13687849.html
版权声明：本文为博主原创文章，转载请附上博文链接！