最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • setInterval()函数的第二个参数

    正文概述 掘金(合肥烂南瓜)   2021-08-22   1569

    setInterval定时器函数的第二个参数为变量

    当第二个参数为变量的时候,变量改变了,但是我发现执行的等待时间并没有什么变化,还是等待原本第一次设置的时长,于是我就写了几句代码测试了一下。发现了确实是这样子,好像是setInterval()函数一旦启动这个设置的时间就是固定了,不会再改变。

    // 初始等待时间
    let waitDate = 1000;
    
    // 成长的小明
    const GrowingPeople = {name: '小明', age: 14, sex: '男'};
    
    // 年纪增长函数
    function ageIncrease(people) {
        const { age } = people;
        if(age && age >= 18){
            return true;
        } else {
            people.age = people.age + 1;
            return false;
        };
    }
    
    // 提示成年函数
    function promptAdulthood(people) {
        const { name='小刚', age=15, sex='女' } = people;
        const information = `我叫${name},是个${sex}生, 今年${age}岁啦,
            成年啦,可以去上网啦
        `;
        console.log(information);
    }
    
    // 版本1,发现设置的时间不生效
     function simplePoller(queryFn, callback) {
         const stop = setInterval(() => {
         const res = queryFn(GrowingPeople);
             if(res){
                 callback(GrowingPeople);
                 clearInterval(stop);
             } else {
                 console.log(`我才${GrowingPeople.age}岁,还没有成年`);
             }
         }, waitDate * 1.5);
     }
     simplePoller(ageIncrease, promptAdulthood);
    

    本来是想每执行一次,下次执行时间是上次执行时间的1.5倍,但是开始以后每次执行时间都是1秒,我觉得应该是setInterval()在初始化的时候就固定了这个执行时间,不管你这个变量之后怎么变化,它还是按初始化的时候给的值去定时执行,所以想要改变这个定时的时间,这个方式就不太合适了,换一种方式,改递归调用吧。

    // 初始等待时间
    let waitDate = 1000;
    
    // 成长的小明
    const GrowingPeople = {name: '小明', age: 14, sex: '男'};
    
    // 年纪增长函数
    function ageIncrease(people) {
        const { age } = people;
        if(age && age >= 18){
            return true;
        } else {
            people.age = people.age + 1;
            return false;
        };
    }
    
    // 提示成年函数
    function promptAdulthood(people) {
        const { name='小刚', age=15, sex='女' } = people;
        const information = `我叫${name},是个${sex}生, 今年${age}岁啦,
            成年啦,可以去上网啦
        `;
        console.log(information);
    }
    function simplePoller(queryFn, callback, waitDate) {
        const stop = setInterval(() => {
            const res = queryFn(GrowingPeople);
            if(res){
                clearInterval(stop);
                callback(GrowingPeople);
            } else {
                clearInterval(stop);
                console.log(`下一次询问等待时间,${waitDate}`);
                simplePoller(queryFn, callback, waitDate*1.5)
            }
        }, waitDate);
    }
    
    simplePoller(ageIncrease, promptAdulthood, waitDate);
    

    这样的写法确实实现了每次等待时间,按1.5倍增加了,但是这每次函数执行都会新建一个定时器,然后再把它销毁,感觉是在浪费性能,既然setInterval()函数第二个参数既然不能使用改变的值,那么使用它的意义也不大了。还不如使用递归和setTimeout()。这样也不用每次去清除定时器了

    function simplePoller(queryFn, callback, waitDate) {
        setTimeout(() => {
            const res = queryFn(GrowingPeople);
            if(res){
                callback(GrowingPeople);
            } else {
                console.log(`下一次询问等待时间,${waitDate}`);
                simplePoller(queryFn, callback, waitDate*1.5)
            }
        }, waitDate);
    }
    
    simplePoller(ageIncrease, promptAdulthood, waitDate);
    

    附上最后一次执行打印记录。 setInterval()函数的第二个参数

    这样看起来代码简洁多了,虽然没有从本质上解决setInterval函数参数设置变量的问题,但是换了一种思路,也是可以实现的。

    目前还是个前端小菜鸡,没有找到setInterval这个函数的源码,希望有大佬看到可以帮忙看看,是不是我的写法有问题,有什么更好的办法,也可以留言,交流一下呀。


    起源地下载网 » setInterval()函数的第二个参数

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元