花了三天时间,终于弄清楚闭包的各种写法和注意的事项,以及以前写,经常出错的地方,特此做一个总结,虽然不够专业,但是对于那些初学者来说,绝对对闭包的理解事半功倍。

案例一:

function aa(){

var b=10;

return function cc(){

b++;

  alert(b);

  }

} aa()();

这个函数调用时,aa()(),有两个括号,第一个是调用aa函数,第二个是执行cc函数。

function test(){

return function(){alert("不做死就不会死!")} }

test()();

第一个括号 执行test函数  返回子函数,第二个括号执行test返回的函数

为什么后面还要加一个括号,以前我直接test()这样调用,但是没有弹出结果,也没有报错。 后来在网友的提示下:再加一个括号,就可以了,注意直接test() 它返回的是子函数的内容,并没有调用子函数,不信你可以输出一下:

alert(test()) ,结果:

,再加上括号,就调用了:

如果觉得很难理解,你可以把它想象返回的不是一个函数,而是一个字符串, :比如:

function test(){

  return  alert("a+b");

test();  结果:

还有子函数里为什么要写return,?这是因为要在父函数外部调用 。看下面这段代码;

function a(){

   var i=0;

function b(){

    alert(++i);

  }

return b; //返回b函数本身内容,不能写成return b()这样直接执行了     }

var c = a();

     c();

这段代码有两个特点:

1、函数b嵌套在函数a内部;

2、函数a返回函数b。

引用关系如图:

这样在执行完var c=a()后,变量c实际上是指向了函数b,再执行c()后就会弹出一个窗口显示i的值(第一次为1)。这段代码其实就创建了一个闭包,为什么?因为函数a外的变量c引用了函数a内的函数b,就是说:

当函数a的内部函数b被函数a外的一个变量引用的时候,就创建了一个闭包。

如果不想用两个括号调用,有两种方式。一是定义一个变量接收子函数返回的值,再执行变量所在的函数,二是子函数直接在里面就调用。 还是拿案例一来说: 可以改成第一种方式。

function aa(){

  var b=10;

  return function cc(){

    b++;

    alert(b);

  }

}

var dd=aa();

dd();

二: function aa(){

    var b=10;

     (function cc(){

      b++;

      alert(b);

      })();

  }

alert(aa());

结果:11,undefined

为什么第二个会弹出undefined,因为:如果一个函数没有返回值,则会留下一个

undefined

注意如果内部函数在里面执行,那么前面就不要写return, 如:return (function cc(){ b++; alert(b); })();  此时return在里面没有意义,因为没有返回值 ,就不要写return,就像java 不会写return void一样。函数运行就是个闭包,如果里面的子函数不在里面执行,就要加上return ,然后在父函数外面调用返回的子函数。

下面这个问题困扰我好久,后来在网友的提示下,才弄懂。点击第个li,得到其索引。 问题:里面子函数并没有执行,为什么也能弹出结果?

代码如下:

window.onload=function(){

   var li=document.getElementsByTagName("li");

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

    li[i].onclick=(function(n){

    return  function(){

    alert(n);

  }

})(i);

}

}

<ul>

  <li>1</li>

  <li>2</li>

  <li>3</li>

  <li>4</li>

  <li>5</li>

</ul>

像 上面那些写法都是要么在里面加上括号,直接调用,要么在父函数外面执行。而这里却没有?

解释:上面的内部的函数被绑定到事件上了

javascript笔记——闭包的更多相关文章

  1. [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码

    函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...

  2. 深入浅出JavaScript之闭包(Closure)

    闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...

  3. 【转】深入浅出JavaScript之闭包(Closure)

    闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...

  4. [Effective JavaScript 笔记]第3章:使用函数--个人总结

    前言 这一章把平时会用到,但不会深究的知识点,分开细化地讲解了.里面很多内容在高3等基础内容里,也有很多讲到.但由于本身书籍的篇幅较大,很容易忽视对应的小知识点.这章里的许多小提示都很有帮助,特别是在 ...

  5. [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法

    js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...

  6. 【转】理解JavaScript之闭包

    闭包(closure)是掌握Javascript从人门到深入一个非常重要的门槛,它是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面写下我的学习笔记~ 闭包-无处不 ...

  7. 深入理解JavaScript的闭包特性如何给循环中的对象添加事件

    初学者经常碰到的,即获取HTML元素集合,循环给元素添加事件.在事件响应函数中(event handler)获取对应的索引.但每次获取的都是最后一次循环的索引.原因是初学者并未理解JavaScript ...

  8. JavaScript作用域闭包简述

    JavaScript作用域闭包简述 作用域 技术一般水平有限,有什么错的地方,望大家指正. 作用域就是变量起作用的范围.作用域包括全局作用域,函数作用域以块级作用域,ES6中的let和const可以形 ...

  9. JavaScript的闭包原理

    什么是js(JavaScript)的闭包原理,有什么作用? 一.定义 官方解释:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 个人的理解是 ...

随机推荐

  1. 2.目录:疯子讲iOS课程

    目录:疯子讲iOS课程 写这个目录让我纠结好几天,一是我在考虑要不要从Objective-c基础开始讲,是否要使用ARC的方式讲,二是本人的游戏这几天正在封测,时间也比较紧张.纠结于有些朋友可能还不了 ...

  2. [Angular 2] Inject Service with "Providers"

    In this lesson, we’re going to take a look at how add a class to the providers property of a compone ...

  3. Mac OS X 10.10 Yosemite下安装java、jdk、mysql、maven、idea

    Mac OS X Yosemite已经在2014年10月17日正式发布了. 作为一个java开发者,尝鲜第一时间安装了最新版本. 和之前的OS X系统还是有很多不同的.下面主要在java开发环境方面做 ...

  4. 关于flash player debugger 无法弹窗报错的解决办法

    第一个是IE的插件, Download the Windows Flash Player 10.2 ActiveX control content debugger (for IE) (EXE, 2. ...

  5. UEditor-JSP版部署说明

    昨天项目中需要在UEditor用到图片上传功能,于是昨天中午便开始做这一块的整合,一不小心就弄到了现在, 坑还挺多的,比如一开始一直报ActionEnter cannot be resolved to ...

  6. True Zero Downtime HAProxy Reloads--转载

    原文地址:http://engineeringblog.yelp.com/2015/04/true-zero-downtime-haproxy-reloads.html HAProxy: Corner ...

  7. Cheap CK100 1024 tokens NXP FIX Chip on Eobd2

    CK100 is a well-known and cost-effective key programmer for many cars. Some said it is a must for bo ...

  8. 字体的大小(pt)和像素(px)如何转换?

    px:相对长度单位.像素(Pixel). pt:绝对长度单位.点(Point). 1in = 2.54cm = 25.4 mm = 72pt = 6pc 具体换算是: Points Pixels Em ...

  9. 分享一个java线程专栏

    专栏 : java线程基础 转载自 http://blog.csdn.net/column/details/yinwenjiethread.html 专栏内容: 1.线程基础:线程(1)--操作系统和 ...

  10. javaweb学习总结二十(http响应)

    一:http响应 1:http响应的组成部分 状态行.响应头.空行.响应数据 2:状态行 常用状态码: 200:请求成功 302:请求路径已经转移,请访问别的地址 307或者304: 请访问缓存信息 ...