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. PhoneGap/Cordova Android应用签名公布注意事项

    今天最终要公布Android HybirdApp了,安装曾经做原生应用的流程公布签名Apk,没想到立即遇到了几个问题.如今把它们的解决的方法整理下来. export signed Apk 遇到以下错误 ...

  2. [Java开发之路]（9）对象序列化与反序列化

    1. 对象序列化 当你创建对象时.仅仅要你须要.它会一直存在,可是程序终止时,不管何时它都不会继续存在.虽然这样做是很有意义的,可是在某些情况下.假设程序不执行时扔能存在而且保存其信息,那将对我们很实 ...

  3. 第一天，Mysql安装，DDL（数据库定义语言），DBA，DML（数据库操纵语言），导入外面的sql文件

    把“D:\mysql-5.6.22-winx64\bin”添加到系统环境变量path中了,然后在任意目录可访问mysql等命令,这样如登录等操作就不需要进入MySQL安装目录才好执行! MySQL下载 ...

  4. Vue绑定事件

    <!-- 方法处理器 --> <button v-on:click="doThis"></button> <!-- 内联语句 --> ...

  5. Mahout的推荐系统

    Mahout的推荐系统 什么是推荐系统 为什使用推荐系统 推荐系统中的算法 什么是推荐系统 为什么使用推荐系统? 促进厂商商品销售,帮助用户找到想要的商品 推荐系统无处不在,体现在生活的各个方面 图书 ...

  6. Javascript：存储和读取cookie

    Cookie是网页开发中的一项重要技术,用于在本地存储一些信息(如username,password.登录状态)以便用户下一次訪问时使用(或在其他页面使用). cookie的格式是键值对,多个键值对之 ...

  7. JavaScript全讲-架构原则解析

    因为近期一直在忙,非常久没有更新,见谅. 上篇我们讲完JavaScript函数式编程的特性,今天我们就来聊聊JavaScript中的架构. 提到JavaScript架构.非常多人会认为不可思议,由于架 ...

  8. POJ 题目1145/UVA题目112 Tree Summing（二叉树遍历）

    Tree Summing Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 8132   Accepted: 1949 Desc ...

  9. Mysql数据库存储引擎--转

    原文地址:http://pangge.blog.51cto.com/6013757/1303893 简单介绍 存储引擎就是指表的类型.数据库的存储引擎决定了表在计算机中的存储方式.存储引擎的概念是My ...

  10. 洛谷P1316 丢瓶盖

    题目描述 陶陶是个贪玩的孩子,他在地上丢了A个瓶盖,为了简化问题,我们可以当作这A个瓶盖丢在一条直线上,现在他想从这些瓶盖里找出B个,使得距离最近的2个距离最大,他想知道,最大可以到多少呢? 输入输出 ...