【JS基础进阶】（六）JavaScript变量、作用域和内存问题

2018-12-22 本文已影响10人虹猫1992

对基本类型和引用类型的值的内存空间、按值访问或按引用访问、以及变量值的复制可参考《【JS基础进阶】JavaScript栈内存与堆内存》。

（一）函数参数的传递

ECMAScript 中所有函数的参数都是按值传递的。也就是说，把函数外部的值复制给函数内部的参数，就和把值从一个变量复制到另一个变量一样。

基本类型值的传递如同基本类型变量的复制一样;
引用类型值的传递，则如同引用类型变量的复制一样。
访问变量有按值和按引用两种方式，而参数只能按值传递;
可以把 ECMAScript 函数的参数想象成局部变量。

在向参数传递基本类型的值时，被传递的值会被复制给一个局部变量，这个局部变量的变化不会影响函数的外部。

function addTen(num) { 
    num += 10; 
    return num; 
}
var count = 20; 
var result = addTen(count); 
alert(count);   //20，没有变化 
alert(result);  //30

变量count的值被传递给函数的参数num以便在函数中使用，此时变量count和参数num的值虽然是一样的，但是它们是两个相互独立的变量，在函数中改变参数num的值并不会影响函数外部的变量count的值。

在向参数传递引用类型的值时，会把这个值在内存中的地址复制给一个局部变量，因此这个局部变量的变化会反映在函数的外部。

function setName(obj) {
     obj.name = "Nicholas";
 }
 
 var person = new Object();
 setName(person);   // obj = person
 alert(person.name);

当 var person = new Object(); 时，可以用下图表示变量和对象的关系：

引用类型参数传递-1

当调用函数 setName(person); 时，下图可以表示全局变量person和局部变量obj的关系：

引用类型参数传递-2

以上代码中创建一个对象，并将其保存在变量person中。然后，这个变量被传递到setName(obj)函数中之后就被复制给了obj。在这个函数内部，obj和person引用的是同一个对象。于是，在函数内部为obj添加name属性后，函数外部的person也将有所反应；因为这时的person和obj指向同一个堆内存地址。所以，很多人错误的认为：在局部作用域中修改的对象会在全局对象中反映出来，就说明参数是按引用传递的。

为了证明对象也是按值传递的，我们再来看看下面这个经过修改的例子：

function setName(obj) {
     obj.name = "Nicholas";
     //改变obj的指向，此时obj指向一个新的内存地址，不再和person指向同一个
     obj = new Object(); 
     obj.name = "Greg";
 }
 
 var person = new Object();
 setName(person);  
 alert(person.name);  //"Nicholas"

当创建obj对象 obj = new Object(); 时，来看看这时person和obj的关系图：

引用类型参数传递-3

这个例子与前一个唯一的区别，就是setName()函数中添加了两行代码： obj = new Object(); 用来改变obj的指向; obj.name = "Greg";用来给新创建的obj添加属性。如果是按引用传递的，那么person就会自动被修改为指向新创建的obj的内存地址，则person的name属性值被修改为"Greg"。但是，当访问person.name时，显示的结果为"Nicholas"。这说明即使在函数内部修改了参数的值，但原始的引用仍然保持未变。实际上，当在函数内部重写obj时，这个变量引用的就是一个局部对象了。而这个局部对象会在函数执行完毕后被立即销毁！

（二）执行环境及作用域

执行环境概念

执行环境定义了变量或函数有权访问的其他数据，决定了它们各自的行为。每个执行环境都有一个与之关联的变量对象（variable object），环境中定义的所有变量和函数都保存在这个对象中。

每个函数都有自己的执行环境。当执行流进入一个函数时，函数的环境就会被推入一个环境栈中。而在函数执行之后，栈将其环境弹出，把控制权返回给之前的执行环境。

当代码在一个环境中执行时，会创建变量对象的一个作用域链（scope chain）。作用域链的用途，是保证对执行环境有权访问的所有变量和函数的有序访问。

var color = "blue"; 
function changeColor(){ 
    var anotherColor = "red"; 
    function swapColors() { 
        var tempColor = anotherColor; 
        anotherColor = color; 
        color = tempColor; 
        // 这里可以访问 color、anotherColor 和 tempColor 
    } 
    // 这里可以访问 color 和 anotherColor，但不能访问 tempColor         
    swapColors(); 
} 
// 这里只能访问 color changeColor();

关于执行环境的几点总结：

执行环境有全局执行环境（也称为全局环境）和函数执行环境之分；

每次进入一个新执行环境，都会创建一个用于搜索变量和函数的作用域链；

函数的局部环境不仅有权访问函数作用域中的变量，而且有权访问其包含（父）环境，乃至全局环境；

全局环境只能访问在全局环境中定义的变量和函数，而不能直接访问局部环境中的任何数据；

变量的执行环境有助于确定应该何时释放内存;

函数参数也被当作变量来对待，因此其访问规则与执行环境中的其他变量相同。

没有块级作用域

for (var i=0; i < 10; i++){ 
    doSomething(i); 
} 
alert(i);      //10

对于有块级作用域的语言来说，for 语句初始化变量的表达式所定义的变量，只会存在于循环的环境之中。而对于 JavaScript 来说，由 for 语句创建的变量 i 即使在 for 循环执行结束后，也依旧会存在于循环外部的执行环境中。

（1）声明变量

使用 var 声明的变量会自动被添加到最接近的环境中。在函数内部，最接近的环境就是函数的局部环境；在with 语句中，最接近的环境是函数环境。
如果初始化变量时没有使用 var 声明，该变量会自动被添加到全局环境。

function add(num1, num2) { 
    sum = num1 + num2; 
    return sum; } 
var result = add(10, 20);  //30 alert(sum);

（2）查询标识符

当在某个环境中为了读取或写入而引用一个标识符时，必须通过搜索来确定该标识符实际代表什么。搜索过程从作用域链的前端开始，向上逐级查询与给定名字匹配的标识符。
如果在局部环境中找到了该标识符，搜索过程停止，变量就绪。
如果在局部环境中没有找到该变量名，则继续沿作用域链向上搜索。搜索过程将一直追溯到全局环境的变量对象。
如果在全局环境中也没有找到这个标识符，则意味着该变量尚未声明。

var color = "blue"; 
function getColor(){ 
    var color = "red"; 
    return color; 
} 
alert(getColor());  //"red"

（三）垃圾收集

JavaScript 是一门具有自动垃圾收集机制的编程语言，开发人员不必关心内存分配和回收问题。
关于JavaScript 的垃圾收集的一些总结：

离开作用域的值将被自动标记为可以回收，因此将在垃圾收集期间被删除。

“标记清除”是目前主流的垃圾收集算法，这种算法的思想是给当前不使用的值加上标记，然后再回收其内存。

另一种垃圾收集算法是“引用计数”，这种算法的思想是跟踪记录所有值被引用的次数。JavaScript 引擎目前都不再使用这种算法；但在IE 中访问非原生 JavaScript 对象（如 DOM 元素）时，这种算法仍然可能会导致问题。

当代码中存在循环引用现象时，“引用计数”算法就会导致问题。

解除变量的引用不仅有助于消除循环引用现象，而且对垃圾收集也有好处。为了确保有效地回收内存，应该及时解除不再使用的全局对象、全局对象属性以及循环引用变量的引用。

【JS基础进阶】（六）JavaScript变量、作用域和内存问题

（一）函数参数的传递

（二）执行环境及作用域

（三）垃圾收集

猜你喜欢

热点阅读