任务二十~闭包、定时器

问答部分

一、什么是闭包? 有什么作用？

闭包是指有权限访问另一个函数作用域的变量的函数，创建闭包的常见方式就是在一个函数内部创建另一个函数，如下代码

var i = 0;
function dealWith(){
    function addTen(){
        i += 10;
        console.log(i);
    }
    return addTen;
}
var addTen = dealWith();
addTen();//10

以上代码输出结果为10。如果没有形成闭包，则不能在函数的外部访问其内部的函数，如下图所示

未形成闭包

闭包的作用：一是可以通过闭包读取函数内部的变量；二是内存不被释放，让这些变量的值始终保持在内存中

二、setTimeout(funcName|code,0)有什么作用？

setTimeout函数用来指定某个函数或某段代码，在多少毫秒之后执行~这里的执行指的是添加进队列，不一定是马上执行
setTimeout(funcName|code,0)的作用是让（funcName|code）在现有的任务（脚本的同步任务和“消息队列”指定的任务）一结束就立刻执行~即尽可能早地执行指定的任务，而并不是会立刻就执行这个任务，如下代码

console.log("first");
setTimeout('console.log("second")',0);
console.log("third");

setTimeout(funcName|code,0)执行效果图

代码部分

一、下面的代码输出多少？修改代码让fnArr[i]()输出 i，使用两种以上的方法

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

以上代码的输出结果为10
方法一，如下代码

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

方法一

方法二，如下代码

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

方法二

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

var Car = //todo;
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

实现代码如下

function testCar(){
    var speed = 0;
    function setSpeed(n){
        speed = n;
    }
    function getSpeed(){
        console.log(speed);
        return 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
    }
}
var Car = testCar();
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';

代码2

三、写一个函数使用setTimeout()模拟setInterval()的功能

实现代码如下

//setInterval()
var i = 0;
setInterval(function(){
    console.log(i++);
},3000); 
//setTimeout()模拟setInterval()
var j = 0;
function asInterval(){
    setTimeout(function(){
        console.log(j++);
        asInterval();
    },3000);
}           
asInterval();

代码3

四、写一个函数，计算setTimeout()平均最小时间粒度

实现代码如下

function getMini(){
    var i = 0;
    var start = Date.now();
    var timer = setTimeout(function(){
        i++;
        if(i === 1000){
            clearTimeout(timer);
            var end = Date.now();
            console.log((end - start) / i);
        }
        timer = setTimeout(arguments.callee,0);
    },0);
}

代码4

五、下面这段代码输出结果是? 为什么?

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

输出结果如下图所示

代码5

解释如下

var a = 1;
setTimeout(function(){
    a = 2;
    console.log(a);
}, 0);//由于使用了setTimeout(f,0)，会使得其包含的代码在执行完其它代码才能执行~即被放到最后，最
后输出2
var a ;//a = 1
console.log(a);//首先输出1
a = 3;//a = 3
console.log(a);//其次输出3

六、下面这段代码输出结果是? 为什么?

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

以上代码没有输出，因为setTimeout(f,0)会让其包含的代码在其它代码执行完后才能执行；当执行完第一行代码后直接跳到while语句，而while语句中的判断条件为真，将会一直执行，进入死循环，所有没有输出

七、下面这段代码输出？如何输出delayer: 0, delayer:1...（使用闭包来实现）

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