前端基础(问答15)


keywords: 闭包、定时器。


  • 什么是闭包? 有什么作用

内层函数调用外层函数的变量,该内层函数即为闭包。本质上,闭包是将函数外部和函数内部的作用域链接起来的桥梁。

比如:

//在全局中访问函数的局部变量
      function f1(){
        var n=999;
        function f2(){
          return n;
        }
        return f2;
      }
      var result=f1();
      result(); // 999

作用:1、读取函数的内部变量;
2、将这些变量的值始终保存在内存。

举例说明闭包的作用:

  function f1(){
    var n=999;
    nAdd=function(){n+=1}
    function f2(){
      console.log(n);
    }
    return f2;
  }
  var result=f1();       //此时,result即为f2函数;同时,result是全局变量,
  result(); // 999        //调用f2函数,此时n为999
  nAdd();                   //nAdd为全局变量,可以在函数外部调用;同时nAdd既是匿名函数,又是闭包,此时n=1000
  result(); // 1000      //调用f2函数,此时n为1000

可以看到,f1的变量n一直保存在内存中,并没有随f1调用后清除。
为什么变量n不被清除呢? 这是因为f2作为全局变量result保存下来,同时f2依赖于f1的存在,f1也就始终保存在内存中。

参考:
学习JavaScript闭包
解释JavaScript的作用域和闭包

  • setTimeout 0 有什么作用

setTimeout(fn,0)会把fn放在代码最后执行。
例如:

console.log(1); 
setTimeout(function(){ console.log(2);}, 0);
 console.log(3);
//1
//3
//2

参考:
定时器

  • 代码

  • 下面的代码输出多少?修改代码让fnArr[i]()输出i。使用两种以上的方法

var fnArr = []
for (var i = 0; i < 10; i ++) {     //for循环,完成10次赋值操作
    fnArr[i] = function() {
        return i
    }  //此时function未执行
}       //for循环执行完毕,i===10
console.log(fnArr[3]())
//为什么上述代码没有实现预期目的?
//关键在于for循环中的function的 i 没有随for改变
//因此有如下方案:

===========方法一===================
    
for (var i = 0; i < 10; i ++) {
    fnArr[i] =(function(i) {
        return function () {
            return i
        }
        console.log(i)
    })(i)
}

===========方法二===================

for (var i = 0; i < 10; i ++) { 
    (function (i) {
        fnArr[i] = function() {
        return i
    }
  })(i)
}  

  • 使用闭包封装一个汽车对象,可以通过如下方式获取汽车状态


var Car = (function () {
    var speed = 0
    function setSpeed(spd) {
        speed = spd
    }
    function getSpeed(){
         console.log(speed)
    }
    function accelerate() {
         speed += 10
    }
    function decelerate () {
        speed -= 10
    }
    function getStatus () {
        if (speed > 0) console.log('running')
        else  console.log('stop')
    }
    return {
        'setSpeed' : setSpeed,
        'getSpeed' : getSpeed,
        'accelerate' : accelerate,
        'decelerate' : decelerate,
        'getStatus' : getStatus
    }
})()



Car.setSpeed(30);
Car.getSpeed(); //30
Car.accelerate();
Car.getSpeed(); //40;
Car.decelerate();
Car.decelerate();
Car.getSpeed(); //20
Car.getStatus(); // 'running';
Car.decelerate(); 
Car.decelerate();
Car.getStatus();  //'stop';
//Car.speed;  //error

  • 写一个函数使用setTimeout模拟setInterval的功能



function intv(fn, time) {
    setTimeout(function () {
        intv(fn, time)
        fn()
    },time)
}


function test() {
    console.log(1)
}

intv(test,1000)
  • 写一个函数,计算setTimeout最小时间粒度

(function testMini(){
    var i = 1
    var start = new Date()
    var clock = setTimeout(function(){
        i++
        if(i === 1000){
            clearTimeout(clock);
            var stop=new Date();
            console.log((stop-start)/i);
        }
        else {
            var clock = setTimeout(arguments.callee,0);
        }
    },0)
})()
  • 下面这段代码输出结果是? 为什么?

var a = 1;
setTimeout(function(){
    a = 2;
    console.log(a);
}, 0);
var a ;
console.log(a);
a = 3;
console.log(a);

// 1
// 3
// 2
//setTImeout中的代码会在后面代码执行完毕后再执行
  • 下面这段代码输出结果是? 为什么?

var flag = true;
setTimeout(function(){
    flag = false;
},0)
while(flag){}
console.log(flag);

//卡死在while无限循环

//因为setTimeout会在后面代码执行完毕后再执行,实际代码如下:
//var flag = true;
//while(flag){}
//console.log(flag);
//setTimeout(function(){
//    flag = false;
//},0)
  • 下面这段代码输出?如何输出delayer: 0, delayer:1...(使用闭包来实现)

for(var i=0;i<5;i++){
   (function (i) {
     setTimeout(function(){
         console.log('delayer:' + i );
    }, 0)

})(i)
       console.log(i)
}


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,088评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,715评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,361评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,099评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 60,987评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,063评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,486评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,175评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,440评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,518评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,305评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,190评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,550评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,880评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,152评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,451评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,637评论 2 335

推荐阅读更多精彩内容