javascript 闭包的理解(二)

    // 定义一个User构造函数
    function User(properties){
        //遍历对象属性,确保它作用域正确
        for(var i in properties){
            (function(which){
                var p = i;
                //为属性创建获取器
                which["get"+i] = function(){
                    return properties[p];
                };
                //为属性创建设置器
                which["set"+i] = function(val){
                    properties[p] = val;
                    //return properties[p];
                };
            })(this);
        }
    }

    // 创建一个User实例
    var user = new User({
        name:"Bob",
        age:44,
        islive:true,
        money:50000,
        earn:5000,
        nation:"china",
        job:"web Dev"
    });

        user.getname();           // 返回 "Bob"
        user.getage();              // 返回 "44"

        user.getage.call(window);      // 依然返回44
        user.getage.call({age: 23});  // 还是返回44

上面的这段代码(我们叫它代码段A吧)里, user.getage.call(window)user.getage.call({age: 23}) 返回的结果,虽然在意料之中,但是我却并不非常清楚的知道为什么是这样。

我只是大概的知道,之所以是这个结果,肯定跟User构造函数里的闭包有关系。

我认为User构造函数里有两个闭包,所以我猜想调用user.getage的时候,就生成了2个闭包作用域。

但这只是我的猜想,事实是不是这样的呢?我想到了一个办法来验证:使用console.dir()

var getage = user.getage;

console.dir(getage);

输出如下:

从输出的对象结构,可以看到这个方法它的[[Scopes]]确实有两个Closure,而且每个Closure里面有些什么东西也显示出来了。

我猜想在执行getage方法时,会先执行第一个闭包作用域,也就是Closure 0,这个闭包是由代码段A里的以下代码生成的:

which["get"+i] = function(){
    return properties[p];
};

我觉得这里应该搞清楚闭包、闭包作用域、闭包包含的作用域 三个概念,否则理解起来会很蒙,搞不清楚。

闭包:就是以上代码所定义的函数which[“get”+i]。

闭包作用域:就是由以上代码生成的执行上下文空间,它就是对象结构图中的那个[[Scopes]]。

闭包包含的作用域:可以看到[[Scopes]]里面还包含了getage闭包引用的另外两个闭包的作用域里的变量:立即执行函数的作用域里的变量p 和 User函数作用域里的变量i变量properties

从对象结构里可以看到,闭包 Closure 0 里面存在一个变量p,因此执行闭包时,会去闭包作用域里搜索p,但搜索不到,因为p是在立即执行函数的作用域里定义的,所以会立即进入搜索Closure 0作用域的流程。

搜索Closure 0时,找到了p,并且发现p = i,此时p的定义找到了,但p等于i,所以进入搜索变量i的定义的流程。

因为变量i没有在立即执行函数里定义,所以Closure(User)被保留了下来,在立即执行函数的作用域里找不到变量i,就进入Closure(User)作用域寻找,找到了i,同时应为是立即执行函数,所以i的值一搜索到,就理解返回给p,并存入Closure 0作用域中,而Closure(User)中的i的值由于程序继续执行而变化,最后只会存入最后设置给i的值。

properties的值也是一样,在闭包作用域里找不到,就会去立即执行函数的作用域里找,找不到再去Closure(User)里找,找到了立即返回。

所以上面那段生成闭包 Closure 0 的代码执行后,返回的结果就是 properties[i],此时闭包作用域使用完毕,不再需要,可以回收,进入解析Closure(User)作用域的步骤

然后properties[i] 被解析为 properties[“age”],然后被返回。

原文地址:https://www.cnblogs.com/macliu/p/11161414.html

时间: 2024-07-30 21:17:57

javascript 闭包的理解(二)的相关文章

javascript闭包的理解-韩烨

javascript闭包是javascript的难点,很多人对js闭包不是很理解,我对js闭包一开始也是云里雾里,我刚刚进兴安得力的时候,做的转正试题中就有一个对闭包理解的题目.如何理解javascript的闭包呢?下面我们一起来学习一下: 闭包的含义和理解 通俗地讲,JavaScript 中每个的函数都是一个闭包,但通常意义上嵌套的函数更能够体现出闭包的特性,请看下面这个例子: var generateClosure = function() { var count = 0; var get

我对JavaScript闭包的理解

一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Js代码 var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Js代码 function f1(){ var n=999; } alert(n); // error 这里有一个地方需要注意,函数

javascript 闭包的理解

看过很多谈如何理解闭包的方法,但大多数文章,都是照抄或者解释<Javascript高级程序设计(第三版)>对于闭包的讲解,甚至例程都不约而同的引用高程三181页‘闭包与变量’一节的那个“返回数组各个项,结果各个项的值都相同”的例程,还有些文章的讲解过程上一步与下一步之间的跨度简直就是一步登天,让人反复看半天都无法理解. 闭包的理解需要很多概念做铺垫,包括变量作用域链.执行环境.变量活动对象.引用式垃圾内存收集机制等,如果对本文涉及的这些概念不理解,可以去找本<Javascript高级程序

javascript闭包的理解和实例

所谓闭包,值得是词法表示包括不必要计算的变量的函数,也就是说,该函数可以使用函数外定义的变量. 顺便提示一下: 词法作用域:变量的作用域是在定义时决定而不是执行时决定,也就是说词法作用域取决于源码,通过静态分析就能确定,因此词法作用域也叫做静态作用域. with和eval除外,所以只能说JS的作用域机制非常接近词法作用域(Lexical scope). 下面是一个简单的使用全局变量的闭包实例: 1 var sWord="Hello,Welcome to web前端开发工程师的博客,请多多指教.&

Javascript闭包简单理解

提到闭包,想必大家都早有耳闻,下面说下我的简单理解.说实话平时工作中实际手动写闭包的场景并不多,但是项目中用到的第三方框架和组件或多或少用到了闭包.所以,了解闭包是非常必要的.呵呵... 一.什么是闭包简而言之,就是能够读取其他函数内部变量的函数.由于JS变量作用域的特性,外部不能访问内部变量,内部可以外部变量. 二.使用场景1. 实现私有成员.2. 保护命名空间,避免污染全局变量.3. 缓存变量. 先看一个封装的例子: var person = function () { // 变量作用域为函

Javascript 回调函数理解---二娃子买肾机6

在Javascript中什么是回调函数,我认为简单来说就是把一个函数B作为参数传递给另一个函数A,在A函数中的一定时机调用函数B. 这里可以看出回调函数形成了一个闭包,它可以访问函数A中的活动对象. 请见下面代码: 某村二娃子像买肾机6,但苹果店发现木有库存了,准备去进货,那么这时候二娃子有选择: 一是: 过一会来问一下:”到货没?“,”没有“! 过一会来问一下:”到货没?“,”没有“! 过一会来问一下:”到货没?“,”没有“! 过一会来问一下:”到货没?“,”没有“! 我们称这为轮询方式,这样

javascript闭包的理解

闭包,是javascript中独有的一个概念,对于初学者来讲,闭包是一个特别抽象的概念,特别是ECMA规范给的定义,如果没有实战经验,你很难从定义去理解它.因此,本文不会对闭包的概念进行大篇幅描述. 1 初探 在接触一个新技术的时候,我首先会做的一件事就是:找它的demo code.对于码农们来说,代码有时候比自然语言更能理解一个事物. 其实,闭包无处不在,比如:jQuery.zepto的主要代码都包含在一个大的闭包中,所以下面我先写一个最简单最原始的闭包demo,好让你在大脑里 产生闭包的画面

关于Javascript闭包的理解

以下内容属个人理解,如有看不明白或漏洞之处,纯属水平不佳,还望见谅. 关于闭包,高程里的定义是:指有权访问另一个函数作用域中的变量的函数.创建闭包最常见的方法就是在一个函数的内部再创建一个函数. 这里先创建一个函数f function f(v1, v2) { // 函数表达式 } 并进行调用 let result = f(5, 10) 为了搞懂闭包,首先要明白上面程序整个过程中发生了什么: 1.当调用f()函数的时候,后台创建了一个f()的执行环境与相应的作用域链(这里的作用域链的来源:在创建f

深入理解javascript闭包

闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. Js代码 var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. Js代码 function