4.函数作用域及作用域链、闭包

1.[[scope]]:每一个函数都是一个对象,对象中有一些属性我们可以访问,有一些属性不可以访问,这些不可访问的属性,仅供JavaScript引擎存取,[[scope]]就是其中一个。

[[scope]]指的就是我们所说的作用域,其中存储了运行期上下文的集合。因为每个函数每次执行的时候都会产生一个执行期上下文,执行完了就销毁了,那么这个[[scope]]里面就存储的是执行期上下文的集合。那么可能如果说只有一个函数的时候,就只是存储这一个函数的执行期上下文,但是如果是函数嵌套函数的话,就会是执行期上下文的集合,就是外面函数有一个上下文,里面函数也有一个上下文.那这样就形成了作用域链。

执行期上下文:当函数执行前一刻,会创建一个称为执行期上下文的内部对象AO。一个执行期上下文定义了一个函数执行时的环境,函数每次执行对应的执行期上下文都是独一无二的,所以多次调用函数会产生多个执行期上下文,当函数执行完毕,它所产生的执行期上下文会被销毁。

function  test(){}

test() --> AO{}

test() --> AO{}  这两个AO没有关系

2.作用域链:[[scope]]中所存储的执行期上下文对象的集合,这个集合呈链式连接,我们把这种链式连接叫做作用域链。

所以如下图所示:当一个函数执行时,在函数里面查找变量时,是从这个函数的作用域的顶端依次往下查找。

当函数被定义的时候,他的作用域顶端所存储的是它所处的那个环境,如下面的a所处的环境就是全局的执行期上下文GO,当他被执行时会把它自己的执行期上下文AO放在作用域顶端,然后将它所处的那个环境GO放到第一位.

真正函数执行的时候,我们要遵循函数作用域链的顺序,从顶端开始来查找变量

function   a(){

    function  b(){

        var b = 234;

    }

    var a = 123;

    b();

}

var glob = 100;

a();

解析:

1)a  defined   a.[[scope]] -->GO:{}      //这是a被定义


2)a  doing      a.[[scope]] -->aAO:{}     //a被执行时,aAO放在函数作用域的顶端(即第0位),

                                            GO:{}      //然后GO放在第一位

3)b  defined  b.[[scope]] -->aAo:{}

                                           GO:{}

4)b  doing     b.[[scpoe]] -->bAO:{}

                                           aAO:{}

                                           GO:{}

b被执行完了以后,会将它自己的执行期上下文销毁,b回到被定义状态,如下图,但是b执行完了a也将执行完,a执行完将销毁a的执行期上下文,a的执行期上下文有包含b,那么b直接就随a的执行期上下文被销毁的同时也被销毁了,a再处于被定义的状态,然后当再执行时会重新执行上面的过程.

当b执行完的时候,b的执行期上下文会被销毁,即第四步的--bAO:{}会被销毁,a也执行完,a的执行期上下文会被销毁,即第二步的--aAO:{}会被销毁,同时aAO里面存的有b,所以b直接被销毁了。第三步b被定义的时候产生的 aAO和第二步的a执行时产生的aAO是同一个执行期上下文,就像这四部里面所有的GO一样都是全局对象的执行期上下文。

3.对象可以有属性,一切为对象的东西都可以有属性,函数就是函数类对象。


4.闭包

function  a(){

    function  b(){

        var bbb = 123;

        a++;

        console.log(a);

    }

    var a = 345;

    return b;

}

var glob = 100;

var demo = a();

demo();

dome();

当a执行一直到a执行完,

1)a  defined   a.[[scope]] -->GO:{}

2)a  doing      a.[[scope]] -->aAO:{}

                                            GO:{}

3)b  defined  b.[[scope]] -->aAo:{}

                                           GO:{}

a执行完,b被保存出来,等待执行,a销毁它的执行期上下文以后并没有将b销毁,b被保存出来,并且b处于被定义的状态,b拥有a之前的执行期上下文

a执行完


b被定义的状态

这个时候b被返回出来,并有赋给demo,a的执行期上下文被销毁,即2)中-->aAO:{}被销毁,但是b里面还保存着3)里面由a生成的执行期上下文,b等待被执行,当demo()被执行时

4)b  doing     b.[[scpoe]] -->bAO:{}

                                           aAO:{}

                                           GO:{}

执行完以后4)里面的-->bAO:{}被销毁但是aAO:{}依然不能销毁,所以从第三步起aAO:{}就相当于被拿到外面来了,并且一直不会被销毁,因为每次demo执行即b执行完了都只能销毁bAO:{}即b的执行期上下文。

5.闭包:当内部函数被保存到外部时,将会生成闭包。闭包会导致原有作用域链不释放,造成内存泄漏。所谓泄漏就是说内存被占用了,被占用了,原有的空间就变少了,就好像气球漏气了变小了一样,就叫泄漏。

6.闭包的作用:

实现公有变量,如:函数累加器;就是最简单的将函数里面的变量保存出来,如下将局部变量a保存出来,这样实现变量公有

```

        function public() {

            let a = 123;

            function add() {

                a ++;

                console.log(a);

            }

            return add;

        }

```

可以做缓存,如:preson函数;food就相当于一个中介,来缓存push函数执行完毕的结果,尽管push函数已经被释放

```

           function preson() {

            let food = "";

            let obj = {

                push : function (Food) {

                    this.food = Food;

                },

                eat : function () {

                    console.log("this preson eat a" + this.food);

                }

            }

            return obj;


        }

        var res = preson();

        res.push("apple");

        res.eat()

```


可以实现封装,属性私有化。如:Person();模块化开发,防止全局污染。

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

推荐阅读更多精彩内容

  • 函数作用域 要理解闭包,必须从理解函数被调用时都会发生什么入手。 我们知道,每个javascript函数都是一个对...
    黎贝卡beka阅读 501评论 0 2
  • 来源:仗剑走天涯! 关于javascript的作用域的一些总结,主要参考以上文章,加上自己的整理的理解。 近日对j...
    Michael_林阅读 942评论 0 1
  • 这两天下雨,有时候思绪会飘很远。看着孩子们欢乐的脸庞,我总是会想,我老了,假如我己70岁了,会是怎样一个场景,拿着...
    隽虹阅读 342评论 0 0
  • 最近在看一部电视剧,虽然主要讲一群妈妈的故事,但是仔细看里面的内容,还是有点感受。但我所说的感受不是说电视剧...
    8e0b8093b46f阅读 288评论 2 4
  • 人有七情六欲,丰富了情感,丰富了生活。而很多养生学——虽没让你断七情、斩六欲,却都说不宜大喜大悲、不宜过忧过思。的...
    跟着宝宝一起成长阅读 223评论 0 2