JS执行环境及作用域

执行环境是JavaScript中很重要的概念。执行环境定义了变量有权访问其它数据。

全局执行环境就是最外围的环境,在web浏览器中全局执行环境被认为是window对象,也就是说我们在全局环境中创建的变量和函数都是作为window对象的属性而存在的。

var a = "window对象的属性a"
function fun(){
    console.log("所有在全局执行环境中创建的变量 函数都是作为window对象的属性而存在的")
} 
window.fun();
console.log(window.a)
/*
所有在全局执行环境中创建的变量 函数都是作为window对象的属性而存在的
window对象的属性a
*/

当某个执行环境中的所有代码执行完毕后,保存在其中的所有变量和函数也会随即销毁(但是全局执行环境知道应用程序退出才会被销毁)

每个函数都有自己的执行环境。当执行到这个函数时这个函数的环境就会被推入环境栈中。而在函数执行之后,栈会把这个函数的执行环境弹出把控制权交还给之前的执行环境

当代码在一个环境中执行的时候会创建作用域链。作用域链的主要作用是保证对执行环境有权的访问的所有变量和函数的有序访问。作用域链的前端始终是当前执行环境下创建的变量

当某个执行环境要读取或写入一个标识符时,就会开始搜索这个标识符。搜索过程是从作用域的前端开始搜索,如果没有搜索到就向上逐级找符合名字匹配的标识符

(标识符用指的是 变量、函数、属性的名字,或者函数的参数)

var a = 1;
function fn1(){
    function fn2(){
        console.log(a);
    }
    function fn3(){
        var a = 4;
        fn2();
    }
    var a = 2;
    return fn3
}
var fn = fn1();
fn();
//最后的输出结果2

上面这个示例最后的输出结果为2,这个例子对初学者来说并不友好。但是理解了上面这个例子就基本理解了作用域运行的规则。
首先 我们定义了函数fn1(),然后我们又在fn1内部创建了两个函数分别为fn2、fn3。然后再var a = 2;最后面return fn3,然后var fn = fn1();由于前面return fn3 所以调用fn()其实是在调用fn3
fn3()又调用了fn2()然后我们就会进入了fn()的作用域,这个时候我们就应该是从fn2的视角中寻找a,fn2内部并没有a所以他会向上级寻找也就是fn1,由于在变量始终在起当前作用域的最前端,所以最终结果为2

然后我们再看一个例子:

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

这个例子表现就是 搜索标识符的时候只会沿着作用域上寻。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,242评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,769评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,484评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,133评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,007评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,080评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,496评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,190评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,464评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,549评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,330评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,205评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,567评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,889评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,160评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,475评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,650评论 2 335

推荐阅读更多精彩内容

  • 作用域 变量作用域有两种:全局变量和局部变量。 变量在函数外定义,即为全局变量,全局变量有全局作用域:网页中所有脚...
    饥人谷_王若曦阅读 367评论 0 0
  • 执行环境/执行上下文(Execution Context) 执行环境定义了变量或函数有权访问的数据。 每个执行环境...
    cccccchenyuhao阅读 196评论 0 1
  • 在 JavaScript 中,函数也是对象,实际上,JavaScript 里一切都是对象。函数对象和其它对象一样,...
    东郭皮蛋阅读 440评论 0 0
  • 提升(var) 我们都认为JavaScript代码执行的时候是由上到下一行一行执行的。但实际上这并不完全正确,有一...
    hhooke阅读 1,885评论 0 1
  • 清晨被一阵噼里啪啦的声音惊醒,隐隐以为是学校施工队在施工,细听却又像雨打在水泥板上,没一会儿,听到隐隐的雷声,才确...
    正在改变的tia阅读 167评论 1 0