码迷,mamicode.com
首页 > Web开发 > 详细

js闭包及问题的解决

时间:2018-03-13 00:57:23      阅读:183      评论:0      收藏:0      [点我收藏+]

标签:log   执行函数   i++   nbsp   int   结果   for循环   异步执行   问题   

  • 闭包定义,作用

    闭包就是能够读取其他函数内部变量的函数。

    作用:一个是可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中

    缺点:闭包会保存函数中的变量在内存中,导致内存消耗大

           闭包会在父函数外部改变父函数内部变量的值

  • 闭包与异步执行函数

   前端使用异步执行的情况有

    a  定时任务:setTimeOut() setInterval()

    b  网络请求:ajax请求 动态<img>加载

    c  时间绑定

  当遇到异步的情况时,函数的输出结果:

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

      setTimeout(function timer(){

        console.log( i );

      },i * 1000);

    } //输出结果是6 6 6 6 6 6

  因为,当执行setTimeOut()时,会暂时跳过这一段,放在缓冲区,当for循环执行结束之后,由于i是全局变量,此时在执行console.log( i )就会是 6,而不是预期中的0 1 2 3 4 5,解决办法通常有两种一是使用ES6中let使for循环中的变量变成块儿作用域,二就是使用立即执行函数,通过函数作用域可以保存变量的特性来将每次循环的变量 i 保存到函数中。

  使用let:

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

      setTimeout( function timer(){

        console.log( i );

      },i * 1000);

    }// 输出结果 0 1 2 3 4 5

  使用立即执行函数(IIFE):

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

      (function(){

        var j = i;

        setTimeout( function timer(){

          console.log( j );

        }, j * 1000);

      })();

    }//输出结果0 1 2 3 4 5

 

js闭包及问题的解决

标签:log   执行函数   i++   nbsp   int   结果   for循环   异步执行   问题   

原文地址:https://www.cnblogs.com/171220-barney/p/8552370.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!