【JS基础】(六)JavaScript变量、作用域和内存问题

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

(一)函数参数的传递

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

  • 基本类型值的传递如同基本类型变量的复制一样;
  • 引用类型值的传递,则如同引用类型变量的复制一样。
  • 访问变量有按值和按引用两种方式,而参数只能按值传递;
  • 可以把 ECMAScript 函数的参数想象成局部变量
  1. 在向参数传递基本类型的值时,被传递的值会被复制给一个局部变量,这个局部变量的变化不会影响函数的外部
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的值。

  1. 在向参数传递引用类型的值时,会把 这个值在内存中的地址复制给一个局部变量,因此这个局部变量的变化会反映在函数的外部
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。在这个函数内部,objperson引用的是同一个对象。于是,在函数内部为obj添加name属性后,函数外部的person也将有所反应;因为这时的personobj指向同一个堆内存地址。所以,很多人错误的认为:在局部作用域中修改的对象会在全局对象中反映出来,就说明参数是按引用传递的。

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

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(); 时,来看看这时personobj的关系图:

引用类型参数传递-3

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

(二)执行环境及作用域

  1. 执行环境概念

执行环境定义了变量或函数有权访问的其他数据,决定了它们各自的行为。每个执行环境都有一个 与之关联的变量对象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(); 

关于执行环境的几 点总结

  • 执行环境有全局执行环境(也称为全局环境)和函数执行环境之分;
  • 每次进入一个新执行环境,都会创建一个用于搜索变量和函数的作用域链;
  • 函数的局部环境不仅有权访问函数作用域中的变量,而且有权访问其包含(父)环境,乃至全 局环境;
  • 全局环境只能访问在全局环境中定义的变量和函数,而不能直接访问局部环境中的任何数据;
  • 变量的执行环境有助于确定应该何时释放内存;
  • 函数参数也被当作变量来对待,因此其访问规则与执行环境中的其他变量相同。
  1. 没有块级作用域
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 元素)时,这种 算法仍然可能会导致问题。
  • 当代码中存在循环引用现象时,“引用计数”算法就会导致问题。
  • 解除变量的引用不仅有助于消除循环引用现象,而且对垃圾收集也有好处。为了确保有效地回 收内存,应该及时解除不再使用的全局对象、全局对象属性以及循环引用变量的引用。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,558评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,002评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,036评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,024评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,144评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,255评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,295评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,068评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,478评论 1 305
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,789评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,965评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,649评论 4 336
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,267评论 3 318
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,982评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,223评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,800评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,847评论 2 351