js闭包小实验

一、总结

一句话总结:

闭包中引用闭包外的变量会使他们常驻内存
function foo() {
var i=0;
return function () {
console.log(i++);
}
}

1、如下实验的结果是什么,为什么?

|||-begin

function foo() {
var i=0;
return function () {
console.log(i++);
}
}
var f1=foo();
var f2=foo();
f1();//
f1();//
f1();//
f2();//
f2();//
f1();//
f2();//

|||-end

foo中的闭包函数引用了foo中的变量i,导致foo和变量i都常驻内存
i++是先赋值后加,所以返回的是+1之前的值
var f1=foo(); 和 var f2=foo(); 表示f1和f2指向不同的foo()实例

二、js闭包小实验

1、不同 变量 指向不同的闭包实例

     function foo() {
var i=0;
return function () {
console.log(i++);
}
}
var f1=foo();
var f2=foo();
f1();//
f1();//
f1();//
f2();//
f2();//
f1();//
f2();//

出现这样结果的原因是因为 闭包 ,在foo函数里面的 闭包 用了foo中的变量 i,所以 这个i及foo函数常驻内存,没有被释放

第7行的var f1=foo(); 和第八行的 var f2=foo(); 会导致 f1和f2指向不同的 foo()实例

第9行第一次f1()的时候 i的 值 是 i++(先赋值后加)   所以结果是0,此时 i的值为1

所以第10行的结果是1

第12行的f2(),因为和f1()指向不同的foo()实例,所以值是0

 
 
 

2、不同 变量 指向同一个 闭包实例

     function foo() {
var i=0;
return function () {
console.log(i++);
}
}
var f1=foo();
var f2=f1;
f1();//
f1();//
f1();//
f2();//
f2();//
f1();//
f2();//

第8行的var f2=f1; 导致 f1和f2指向了同一个 foo()实例,又因为 foo中的闭包应用foo的变量i,导致他们常驻内存,所以 结果就是如上

 

js闭包小实验的更多相关文章

  1. 理解JS闭包的几个小实验

    学了JavaScript有一段时间了,但是对闭包还是不太理解,于是怀着心中的疑问做了几个小实验,终于有点明白了. 首先看一下MDN上的定义:闭包是函数和声明该函数的词法环境的组合. 简单来说,闭包是一 ...

  2. js中关于事件捕获与事件冒泡的小实验

    1.事件冒泡:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div - ...

  3. 关于js闭包之小问题大错误

    闭包是 JavaScript 开发的一个关键方面:匿名函数可以访问父级作用域的变量. 如果闭包的作用域中保存着一个 HTML 元素,则该元素无法被销毁.(下面代码来自高程) 刚看到一个关于闭包自己没注 ...

  4. js的一些常用判断小实验

    下面是小实验案例 // 0 if(undefined) { console.log('1'); } else { console.log('0'); } // 0 if(null) { console ...

  5. JS高级---闭包小案例

    闭包小案例 普通的函数 //普通的函数 function f1() { var num = 10; num++; return num; } console.log(f1()); //11 conso ...

  6. js闭包引起的事件注册问题

    背景:闲暇时间看了几篇关于js作用域链与闭包的文章,偶然又看到了之前遇到的一个问题,就是在for循环中为dom节点注册事件驱动,具体见下面代码: <!DOCTYPE html> <h ...

  7. 浅谈js闭包(closure)

    相信很多从事js开发的朋友都或多或少了解一些有关js闭包(closure)的知识. 本篇文章是从小编个人角度,简单地介绍一下有关js闭包(closure)的相关知识.目的是帮助一些对js开发经验不是很 ...

  8. JS处理事件小技巧

    今天,就分享一下我自己总结的一些JS的小技巧: ①防止鼠标选中事件 <div class="mask" onselectstart="return false&qu ...

  9. js闭包的作用域以及闭包案列的介绍:

    转载▼ 标签: it   js闭包的作用域以及闭包案列的介绍:   首先我们根据前面的介绍来分析js闭包有什么作用,他会给我们编程带来什么好处? 闭包是为了更方便我们在处理js函数的时候会遇到以下的几 ...

随机推荐

  1. elementui 树控件只隐藏第三集菜单

    <!-- 必须属性:default-expanded-keys node-key --> <el-tree :default-expanded-keys='idArr' node-k ...

  2. Eclipse中如何创建一个完整的Maven-Web项目

    Maven Web项目搭建 1.首先确保本地开发环境搭建完毕(jdk,maven). 2.打开Eclipse,新建Maven项目.选择Maven Project选项. 3.将第一项:Create a ...

  3. Linux上使用trash回收机制来替换rm命令

    因为我们日常使用的rm 命令没有恢复机制,删除了文件就找不到了,往往重要的文件,我们要特别小心才对,但是有时还是避免不了我们的误操作.可能会造成很大的影响. 本博文简单介绍一下,用trash命令仿照W ...

  4. docker alpine wkhtmltopdf

    截止2019.08 wkhtmltopdf 还没有 alpine 的版本  如需使用  需要在 alpine 环境中编译 生成 wkhtmltopdf  (使用 apk add wkhtmltopdf ...

  5. Endless looping of packets in TCP/IP networks (Routing Loops)

    How endless looping of packets in a TCP/IP network might occur? Router is a device used to interconn ...

  6. 用js刷剑指offer(调整数组顺序使奇数位于偶数前面)

    题目描述 输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有的奇数位于数组的前半部分,所有的偶数位于数组的后半部分,并保证奇数和奇数,偶数和偶数之间的相对位置不变. 牛客网链接 js代码 ...

  7. mongodb模式模型设计及编码-Mongoose

    走到这一步,我们的网站还不能称为动态的网站,因为所要的数据都是伪造的,所以现在要对数据库的模型进行设计   Mongoose 我们用到的工具模块是Mongoose,他能对Mongodb进行建模的这样一 ...

  8. less-important

    !important关键字:会为所有混合带来的样式,添加!important 在css里面加上!important,是所有样式优先级最高的 在less里面什么场景会用important,在调试的时候 ...

  9. [Visual Studio] 自定义项目模板(.vsix扩展)

    VS自定义项目模板:[2]创建VSIX项目模板扩展 听语音 | 浏览:1237 | 更新:2015-01-02 09:21 | 标签:软件开发 1 2 3 4 5 6 7 分步阅读 一键约师傅 百度师 ...

  10. ASP.Net用户控件的使用

    一.概述: 与WEB窗体页相同,程序员可以使用任何文本编辑器创作用户控件,或者使用代码隐藏类开发用户控件.此外,与WEB窗体页一样,用户控件可以在第一次请求时被编译并存储在服务器内存中,从而缩短以后请 ...