function foo(x){

  var tmp = 3;

  return function(y){  //把一个函数作为返回值,定义时候的作用域

    console.log(x+y+(++tmp))  //++tmp先自加再参与表达式运算

  }

}

var bar = foo(2)    //此时bar指向了匿名函数,匿名函数又指向了 x,tmp两个变量 bar就是一个闭包(匿名函数加x,tmp两个父级变量)

bar(10)  //16

bar(20)  //27 此时函数执行完成后里面的变量没有回收掉 所以tmp还是4 然后++tmp就是5 x还是2 y就是20 (只要bar没有释放里面的变量就不会回收 。关闭浏览器才会释放)

function d(){

  var a = 10;

  console.log(a)

}

d();  //执行完成后 a会被回收 浏览器关闭函数会被回收  函数+引用的变量就会形成闭包

闭包的应用

匿名函数自执行

var t = function (a){  //污染全局 尽量不要定义全局变量

  console.log(a)

}

t(9);

//尽量少的定义全局变量 例如 jQuery 只定义了 $,jQuery两个

;(function(a){

  console.log(a)

})(3)

1、循环注册dom事件

<ul>

  <li></li>

  <li></li>

</ul>

var lis = document.querySelectorAll('li')

for(var i=0; i<lis.length; i++){

  //典型错误

  lis[i].onclick = function(){  //事件的方法执行是:当事件触发的时候执行 绑定事件只有点击才执行。 是异步的 当事件触发的时候 i的值为lengh长度了

    console.log(i)      //变量i是父函数里面的变量

  }

  //正确

  

  (lis[i].onclick = function(a){  //做成自执行函数来注册事件

    console.log(a)  

  })(i)

}

for(var i = 0; i< 10; i++){  //典型错误

  setTimeOut(function(){

    console.log(i)

  },1000)

}

for(var i = 0; i< 10; i++){  //匿名自执行函数解决

  (function(a){

    setTimeout(function(){

      console.log(a)

    },1000)

  })(i)

}

js高级-闭包的更多相关文章

  1. JS高级——闭包

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. JS高级——闭包练习

    从上篇文章我们知道与浏览器的交互操作如鼠标点击,都会被放入任务队列中,而放入到任务队列中是必须等到主线程的任务都执行完之后才能执行,故而我们有时利用for循环给dom注册事件时候,难以获取for循环中 ...

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

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

  4. 《Node.js 高级编程》简介与第二章笔记

    <Node.js 高级编程> 作者简介 Pedro Teixerra 高产,开源项目程序员 Node 社区活跃成员,Node公司的创始人之一. 10岁开始编程,Visual Basic.C ...

  5. 理解运用JS的闭包、高阶函数、柯里化

    JS的闭包,是一个谈论得比较多的话题了,不过细细想来,有些人还是理不清闭包的概念定义以及相关的特性. 这里就整理一些,做个总结. 一.闭包 1. 闭包的概念 闭包与执行上下文.环境.作用域息息相关 执 ...

  6. js高级-面向对象继承

    一.工厂模式创建对象及优缺点 继承就是把公共的部分抽象出来作为父类,基类.吃饭,跑步等 var a = {}; //批量创建不方便,不能重复设置公共属性的代码 //工厂模式出现了,创建10个Cat对象 ...

  7. [ JS 进阶 ] 闭包,作用域链,垃圾回收,内存泄露

    原网址:https://segmentfault.com/a/1190000002778015 1. 什么是闭包? 来看一些关于闭包的定义: 闭包是指有权访问另一个函数作用域中变量的函数 --< ...

  8. js高级---js架构

    ECMAScript1997 年欧洲计算机制造商协会 39 号技术委员会制定了ECMA-262标准(别名 ECMAScript),而浏览器只是负责实现,ie浏览器实现的结果是jscript,远景浏览器 ...

  9. JS的闭包、高阶函数、柯里化

    本文原链接:https://cloud.tencent.com/developer/article/1326958 https://cloud.tencent.com/developer/articl ...

随机推荐

  1. Linux性能优化 第七章 性能工具:网络

    7.1 网络I/O介绍 Linux和其他主流操作系统中的网络流量被抽象为一系列的硬件和软件层次. 链路层,也就是最低的一层,包含网络硬件,如以太网设备.在传送网络流量时,这一层并不区分流量类型,而仅仅 ...

  2. Java并发编程中的相关注解

    引自:http://www.cnblogs.com/phoebus0501/archive/2011/02/21/1960077.html Java并发编程中,用到了一些专门为并发编程准备的 Anno ...

  3. WPF c# 定时器

    //定时查询-定时器 DispatcherTimer dispatcherTimer = new DispatcherTimer(); dispatcherTimer.Tick += (s, e) = ...

  4. vue2.0 slot用法

    学习vue.js也有一段时间了,关于slot这一块,也看了不少次了,总感觉有点迷迷糊糊,不知其然也不知其所以然,抽出一段完整的时间,再一次仔细学习.稍微有点理解了,在此稍作记录,好记性不如烂笔头嘛! ...

  5. ftp的安全问题

    ftp漏洞http://www.4hou.com/technology/3507.html

  6. linux上常见的压缩解压缩的命令

    压缩 tar -cvf jpg.tar *.jpg //将目录里所有jpg文件打包成tar.jpg tar -czf jpg.tar.gz *.jpg   //将目录里所有jpg文件打包成jpg.ta ...

  7. 21.xpath定位中id 、starts-with、contains、text()和last() 的用法

    xpath语法:id .starts-with.contains.text()和last() 的用法 <input id="su" class="bg s_btn ...

  8. 14.json文件读取

    json文件读取 1.#读取json import json str='''[ { "name":"Tom", "gender":" ...

  9. 43.纯 CSS 绘制一个充满动感的 Vue logo

    原文地址:https://segmentfault.com/a/1190000015177284 感想: 又有点回到boder的三角形 HTML code: <div class="v ...

  10. 《算法》BEYOND 部分程序 part 2

    ▶ 书中第六章部分程序,加上自己补充的代码,包括快速傅里叶变换,多项式表示 ● 快速傅里叶变换,需要递归 package package01; import edu.princeton.cs.algs ...