js循环函数中的匿名函数和闭包问题（匿名函数要用循环中变量的问题）

一、总结

需要好好看下面代码

本质是因为匿名函数用到了循环中的变量，而普通方式访问的话，匿名函数的访问在循环之后，所以得到的i是循环执行完之后的i，所以不是正确结果

而直接执行匿名函数的方式当场就拿到了正确的i，闭包的方式也是因为将外部函数的变量保存在内存中从而可以得到正确的i

1、直接执行匿名函数的方式和闭包的方式都可以得到正常的结果

2、普通方式因为循环已经执行完成，所以得到的结果（用到的循环中的变量i）都是i执行完最后的结果

3、闭包的方式需要传参

闭包的方式

1.这里的匿名函数有一个参数 n，也就是最终将返回的结果数值；

2.在调用每个匿名函数时传入变量i

3.变量i的当前值会赋值给n，

4.匿名函数内部创建并返回了一个访问n的闭包

5.如此数组arr中的每个函数中都有了自己的n变量的一个副本(闭包可以将局部变量贮存在内存中)

二、js循环函数中的匿名函数和闭包问题

代码

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

   <meta charset="utf-8">

   <title>课堂演示</title>

 </head>

 <body>

   <script>

   /*

       function fun(){

          var arr=[];

          for(var i=0; i<5; i++){

             arr[i]='元素'+i;

          }

          return arr

       }

       alert(fun())

     // 循环里包含匿名函数

      function fun(){

          var arr=[];

          for(var i=0; i<5; i++){

             arr[i]=function(){

                 return '元素'+i;

             }

          }

          return arr

       }

        //alert(fun())

       //输出一个包含五个匿名函数的数组

       // arr = [function,function,function,function,function];

       var Bb=fun() //循环已经执行完毕，此时的i已经变成4++变为为5

       //alert(Bb);

       //alert(Bb[0]);alert(Bb[1]);alert(Bb[2]);

       //alert(Bb[0]());alert(Bb[1]());alert(Bb[2]());

     // for(var i=0; i<5; i++){

     //   alert(Bb[i]) // arr[i]得到的只是没有执行的匿名函数function(){};

     // }

     alert(Bb.length)

     for(var i=0; i<5; i++){

       alert(Bb[i]()) // Bb[i]()将得到的匿名函数执行，但是并没有得到想要的结果，全都是[元素5]

     }

     //让匿名函数立即执行来赋值

     function fun(){

          var arr=[];

          for(var i=0; i<5; i++){

             arr[i]=(function(){

                 return '元素'+i;

             })() //匿名函数立即执行，函数参数按值传递，故将当前值返回

          }

          return arr

       }

     var Bb=fun()

     alert(Bb.length)

     alert(Bb)

     // for(var i=0; i<5; i++){

     //   alert(Bb[i])

     // }

   */

   //通过闭包让局部变量驻留在内存中

   function fun(){

          var arr=[];

          for(var i=0; i<5; i++){

             arr[i]=function(n){

                 return function(){

                   return '元素'+n;

                 }

             }(i)

          }

          return arr

       }

     var Bb=fun()

     //alert(Bb.length)

    // alert(Bb[0]())

     for(var i=0; i<5; i++){

         //alert(Bb[i])

         alert(Bb[i]())

     }

     //这次成功的输出了 ‘元素0 元素1 元素2 元素3 元素4 ’，而不再都是[元素5]

     /*

87       1.这里的匿名函数有一个参数 n，也就是最终将返回的结果数值；

88       2.在调用每个匿名函数时传入变量i

89       3.变量i的当前值会赋值给n，

90       4.匿名函数内部创建并返回了一个访问n的闭包

91       5.如此数组arr中的每个函数中都有了自己的n变量的一个副本(闭包可以将局部变量贮存在内存中)



     */

   </script>

 </body>

 </html>

js循环函数中的匿名函数和闭包问题（匿名函数要用循环中变量的问题）的更多相关文章

  1. js 从两道面试题加深理解闭包与箭头函数中的this

     壹 ❀ 引 在本文之前我已经花了两个篇幅专门介绍了JavaScript中的闭包与this,正好今早地铁上看到了两道面试题,试着做了下发现挺有意思,所以想单独写一篇文章来记录解析过程.若你对于闭包与t ...

  2. JS函数 -- 功能，语法，返回值，匿名函数，自调用匿名函数，全局变量与局部变量，arguments的使用

    “JavaScript设计得最出色的就是它的函数的实现.” -- <JavaScript语言精粹> 函数包含一组语句,它们是JS的基础模块单元,用于指定对象的行为.一般来说,所谓编程,就是 ...

  3. JavaScript中的闭包和匿名函数

    JavaScript中的匿名函数及函数的闭包   1.匿名函数 2.闭包 3.举例 4.注意 1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没 ...

  4. JavaScript中的闭包与匿名函数

    知识内容: 1.预备知识 - 函数表达式 2.匿名函数 3.闭包 一.函数表达式 1.定义函数的两种方式 函数声明: 1 function func(arg0, arg1, arg2){ 2 // 函 ...

  5. JS中函数的本质，定义、调用，以及函数的参数和返回值

    要用面向对象的方式去编程,而不要用面向过程的方式去编程 对象是各种类型的数据的集合,可以是数字.字符串.数组.函数.对象…… 对象中的内容以键值对方式进行存储 对象要赋值给一个变量 var cat={ ...

  6. PHP中的闭包和匿名函数

    闭包的概念是指在创建闭包时,闭包会封装周围的状态的函数.即便闭包所在环境不在了.但闭包中封装的状态依然存在. 匿名函数就是没有名称的函数. 它们看似很函数一样,实际上它们属于Closure类的实例 P ...

  7. js学习笔记<拷贝传值，引用传址和匿名函数>

    拷贝传值:把一个变量的值拷贝一份,传给了另外一个变量拷贝传值中,两个变量之间没有任何联系,修改其中一个一个变量的值,原来的变量不变. 例: var arr1 = ["张三",24, ...

  8. 浅析PHP中的闭包和匿名函数

    PHP闭包和匿名函数使用的句法与普通函数相同,但闭包和匿名函数其实是伪装成函数的对象(Closure类的实例) .下面给大家介绍PHP中的闭包和匿名函数知识,需要的朋友参考下吧   闭包是指在创建时封 ...

  9. js进阶js中支持正则的四个常用字符串函数（search march replace split）

    js进阶js中支持正则的四个常用字符串函数(search march replace split) 一.总结 代码中详细四个函数的用法 search march replace split 二.js进 ...

  10. Java 终于在 Java 8 中引入了 Lambda 表达式。也称之为闭包或者匿名函数。

    本文首发于 blog.zhaochunqi.com 转载请注明 blog.zhaochunqi.com 根据JSR 335, Java 终于在 Java 8 中引入了 Lambda 表达式.也称之为闭 ...

随机推荐

  1. Codeforces Beta Round #2 C. Commentator problem

    模拟退火果然是一个非常高端的东西,思路神马的全然搞不懂啊~ 题目大意: 给出三个圆,求一点到这三个圆的两切线的夹角相等. 解题思路: 对于这个题来说还是有多种思路的 .只是都搞不明确~~   /害羞脸 ...

  2. js---12数据类型,数据类型转换，NaN,

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  3. Anders Hejlsberg 和 Erich Gamma

    Anders Hejlsberg 和 Erich Gamma 大概半年前,我写了一篇名叫<有点软文>的文章,深情并茂地告诉大家,我司其实隐藏着很多牛人巨擘.有些人是身怀屠龙技,但是大家不认 ...

  4. java种instanceof方法和getclass方法的区别

    在比较一个类是否和另一个类属于同一个类实例的时候,我们通常可以采用instanceof和getClass两种方法通过两者是否相等来判断,但是两者在判断上面是有差别的,下面写个测试类. public c ...

  5. JavaScript--数据结构与算法之图

    图和图的算法:图的定义:由边的集合及顶点的集合组成. 例如地图,每个城镇是顶点,道路是边,由顶点对来定义(城镇1,城镇2)简称(v1,v2)顶点也有权重——成本.基本概念: 有向图:图的顶点对是有序的 ...

  6. Python-Flask项目开发--为什么需要搭建虚拟环境？

    在使用python开发过程中,需要使用到某些工具包/框架等,需要联网下载.   例如,联网安装Flask框架flask-0.10.1版本:pip install flask==0.10.1   此时, ...

  7. 洛谷——P1525 关押罪犯

    https://www.luogu.org/problem/show?pid=1525 题目描述 S 城现有两座监狱,一共关押着N 名罪犯,编号分别为1~N.他们之间的关系自然也极不和谐.很多罪犯之间 ...

  8. 洛谷 P1102 A-B数对

    P1102 A-B数对 题目描述 出题是一件痛苦的事情! 题目看多了也有审美疲劳,于是我舍弃了大家所熟悉的A+B Problem,改用A-B了哈哈! 好吧,题目是这样的:给出一串数以及一个数字C,要求 ...

  9. ios学习之旅---c语言函数

    1.函数的概述 C源程序是由函数组成的. 尽管在前面各章的程序中大都仅仅有一个主函数main(),但有用程序往往由多个 函数组成. 函数是C源程序的基本模块,通过对函数模块的调用实现特定的功能. C语 ...

  10. js获取单选button的值

    <!DOCTYPE html> <html> <body> <script type="text/javascript"> func ...