百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> JS的闭包与按时器
分享文章到:

JS的闭包与按时器

发布时间:09/01 来源:未知 浏览: 关键词:
这次给大家带来JS的闭包与按时器,使用JS的闭包与按时器的留意事项是什么,下面就是实战案例,一起来看一下。

什么是闭包? 有什么作用
闭包就是能够读取其他函数内部变量的函数。
作用:1.可以读取函数内部的变量2.让这些变量的值始终保持在内存中。

setTimeout 0 有什么作用
js运转是基于单线程的,意味着一段代码施行时,其他代码将进入队列等候,一旦线程有余暇就施行后续代码。假如代码中设定了一个setTimeout,那么阅读器便会在适宜的时间,将代码插入任务队列,假如这个时间设为 0,就代表马上插入队列,但并不是马上施行,依然要等候前面代码施行完毕(其实有个延时,详细是16ms还是4ms取决于阅读器)。所以setTimeout并不克不及包管施行的时间,可否及时施行取决于 JavaScript 线程是拥堵还是余暇。

代码

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

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

代码:
办法一:

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

办法二:

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

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

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

代码:

var Car = (function(){
var speed;
function setSpeed(n){
speed = n
}
function getSpeed(){
return console.log(speed);
}
function accelerate(){
speed +=10
return speed;
}
function decelerate(){
speed -=10
return speed;
}
function getStatus(){
return console.log(speed===0?'stop':'running');
}
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的功效
代码:

var i=0;
function intv(){
setTimeout(function(){
console.log(i++);
intv();
},1000);
}
intv();

写一个函数,运算setTimeout最小时间粒度
代码:

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

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

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,那么阅读器便会在适宜的时间,将代码插入任务队列,假如这个时间设为 0,就代表马上插入队列,但并不是马上施行,依然要等候前面代码施行完毕,所以要等代码全部施行完毕后才施行setTimeout(function(){a = 2;console.log(a);}, 0);。

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

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

不会输出结果,由于setTimeout(function(){flag = false;},0)会在所有代码施行完毕后才运转,``flag初始值为true,所以while会不断轮回下去,console.log(flag)也不会被拜访,但是由于某些阅读器会存在环路庇护功效,所以也有大概输出为true```。

下面这段代码输出?怎样输出delayer: 0, delayer:1...(使用闭包来实现)

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

代码:

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

烧脑题

如下console.log的结果是啥?为什么?

function fn(a,b) {
console.log(b);
return {
fn:function(c){
return fn(c,a);
}
};
}
var a = fn(0);
a.fn(1);
a.fn(2);
a.fn(3);
var b = fn(0).fn(1).fn(2).fn(3);
var c = fn(0).fn(1);
c.fn(2);
c.fn(3);

信赖看了本案牍例你已经把握了办法,更多出色请关注百分百源码网其它相关文章!

相关阅读:

简易的CSS3点击响应动画案列

怎样使用python来推断图片类似度

以上就是JS的闭包与按时器的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有151人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板