电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術文章
文章詳情頁

javascript 使用sleep函數的常見方法詳解

瀏覽:2日期:2023-11-01 15:40:54

本文實例講述了javascript 使用sleep函數的常見方法。分享給大家供大家參考,具體如下:

一.什么是sleep函數?

花一點時間來聊一下sleep函數,首先什么是sleep函數?

sleep是一種函數,他的作用是使程序暫停指定的時間,起到延時的效果。

例如:

console.log(’1’);sleep(5000);console.log(’2’);

控制臺輸出數字1后會間隔5秒后輸出數字2

當然上面的代碼是不能執行的,因為js中是沒有sleep方法的。

所以這一篇文章主要介紹幾種在js中實現sleep的方式。

二.為什么使用sleep?

看到這里有人會問了,為什么要使用sleep,上面的例子我可以使用setTimeout來實現啊?

因為setTimeout是通過回調函數來實現定時任務的,所以在多任務的場景下就會出現回調嵌套:

console.time(’runTime:’);setTimeout(function(){ console.log(’1’) setTimeout(function(){ console.log(’2’); setTimeout(function(){ console.log(’3’); console.timeEnd(’runTime:’); }, 2000); }, 3000);}, 2000);// 1// 2// 3// runTime:: 7013.104ms

上面的方式存在回調嵌套的問題,我們希望有一個優雅的方式來實現上面的例子:

sleep(2000);console.log(’1’);sleep(3000);console.log(’2’);sleep(2000);console.log(’3’);...

三.實現sleep

接下來我們就分別用幾種不同的方法來實現下sleep方法

1.基于Date實現

通過死循環來阻止代碼執行,同時不停比對是否超時。

function sleep(time){ var timeStamp = new Date().getTime(); var endTime = timeStamp + time; while(true){ if (new Date().getTime() > endTime){ return; } }}console.time(’runTime:’);sleep(2000);console.log(’1’);sleep(3000);console.log(’2’);sleep(2000);console.log(’3’);console.timeEnd(’runTime:’);// 1// 2// 3// runTime:: 7004.301ms

缺點:

以上的代碼不會讓線程休眠,而是通過高負荷計算使cpu無暇處理其他任務。

這樣做的缺點是在sleep的過程中其他所有的任務都會被暫停,包括dom的渲染。

所以sleep的過程中程序會處于假死狀態,并不會去執行其他任務

2.基于Promise的sleep

為了解決ajax的回調嵌套問題,在jQuery1.8之后支持了Promise。但是單純的Promise只是將之前的縱向嵌套改為了橫向嵌套,

最終結果是下面的代碼:

function sleep(time){ return new Promise(function(resolve){ setTimeout(resolve, time); });}console.time(’runTime:’);console.log(’1’);sleep(1000).then(function(){ console.log(’2’); sleep(2000).then(function(){ console.log(’3’); console.timeEnd(’runTime:’); });});console.log(’a’);// 1// a// 2// 3// runTime:: 3013.476ms

這其實和之前的setTimeout嵌套沒什么區別,也很難看。

我們再次進行優化,使用ES6的Generator函數來改寫上面的例子

3.基于Generator函數的sleep

我們對sleep的執行使用Generator函數來執行,并且搭配co來進行自執行。

看代碼:

var co = require(’co’); function sleep(time){ return new Promise(function(resolve){ setTimeout(resolve, time); });} var run = function* (){ console.time(’runTime:’); console.log(’1’); yield sleep(2000); console.log(’2’); yield sleep(1000); console.log(’3’); console.timeEnd(’runTime:’);} co(run);console.log(’a’);// 1// a// 2// 3// runTime:: 3004.935ms

可以看到整體的代碼看起來不存在嵌套的關系,還是比較舒服的。

并且執行過程不會發生假死情況,不會阻塞其他任務的執行。

但是多了一個co執行器的引用,所以還是有瑕疵。

當然這不是最終版,因為ES7為我們帶來了新的解決方案。

4.基于async函數的sleep

ES7新增了async函數,async函數最大的特點就是自帶執行器,所以我們可以不借助co來實現sleep了

看代碼:

function sleep(time){ return new Promise((resolve) => setTimeout(resolve, time));} async function run(){ console.time(’runTime:’); console.log(’1’); await sleep(2000); console.log(’2’); await sleep(1000); console.log(’3’); console.timeEnd(’runTime:’);} run();console.log(’a’); // 1// a// 2// 3// runTime:: 3009.984ms

效果和之前的一樣。

5.使用child_process(子進程)實現sleep函數

前面介紹了幾種比較簡單的sleep實現,接下來看一個比較難的實現。

原理是將sleep放在子進程中執行,不會影響其他進程,看代碼:

var childProcess = require(’child_process’);var nodeBin = process.argv[0]; function sleep(time) { childProcess.execFileSync(nodeBin, [’-e’, ’setTimeout(function() {}, ’ + time + ’);’]); // childProcess.spawnSync(nodeBin, [’-e’, ’setTimeout(function() {}, ’ + time + ’);’]);} console.time(’runTime:’);console.log(’1’);sleep(1000);console.log(’2’);sleep(2000);console.log(’3’);console.timeEnd(’runTime:’); // 1// 2// 3// runTime:: 3579.093ms

以上代碼,是通過childProcess對象的execFileSync或者spawnSync創建一個同步進程,

在同步進程中執行定時器,定時器執行完畢后回收進程,程序繼續執行。

6.使用npm sleep包

前面的內容都是我們自己實現的,其實npm上已經有很多相關的js包了。

我們來看看他們是怎么實現的,sleep

var sleep = require(’sleep’); console.log(’1’);console.time(’runTime:’);sleep.sleep(2); //休眠2秒鐘console.log(’2’);sleep.msleep(1000); //休眠1000毫秒console.log(’3’);sleep.usleep(1000000) //休眠1000000微秒 = 1秒console.log(’4’);console.timeEnd(’runTime:’); // 1// 2// 3// 4// runTime:: 4014.455ms

很強有沒有,sleep包是C++編寫,然后擴展到Node來實現sleep函數也是一個不錯的選擇。

以上就是sleep的六種簡單實現。歡迎大家指出問題,我們一起進步。

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。

更多關于JavaScript相關內容可查看本站專題:《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》

希望本文所述對大家JavaScript程序設計有所幫助。

標簽: JavaScript
相關文章:
主站蜘蛛池模板: 通风天窗,通风气楼,屋顶通风天窗,屋顶通风天窗公司 | SPC工作站-连杆综合检具-表盘气动量仪-内孔缺陷检测仪-杭州朗多检测仪器有限公司 | 拼装地板,悬浮地板厂家,悬浮式拼装运动地板-石家庄博超地板科技有限公司 | 东亚液氮罐-液氮生物容器-乐山市东亚机电工贸有限公司 | 工业铝型材-铝合金电机壳-铝排-气动执行器-山东永恒能源集团有限公司 | 伊卡洛斯软装首页-电动窗帘,别墅窗帘,定制窗帘,江浙沪1000+别墅窗帘案例 | 水冷散热器_水冷电子散热器_大功率散热器_水冷板散热器厂家-河源市恒光辉散热器有限公司 | 福州甲醛检测-福建室内空气检测_环境检测_水质检测-福建中凯检测技术有限公司 | GAST/BRIWATEC/CINCINNATI/KARL-KLEIN/ZIEHL-ABEGG风机|亚喜科技 | 开锐教育-学历提升-职称评定-职业资格培训-积分入户 | 地图标注-手机导航电子地图如何标注-房地产商场地图标记【DiTuBiaoZhu.net】 | 干式变压器厂_干式变压器厂家_scb11/scb13/scb10/scb14/scb18干式变压器生产厂家-山东科锐变压器有限公司 | 冷却塔厂家_冷却塔维修_冷却塔改造_凉水塔配件填料公司- 广东康明节能空调有限公司 | 郑州墨香品牌设计公司|品牌全案VI设计公司 | 聚氨酯保温钢管_聚氨酯直埋保温管道_聚氨酯发泡保温管厂家-沧州万荣防腐保温管道有限公司 | 设定时间记录电子秤-自动累计储存电子秤-昆山巨天仪器设备有限公司 | 周口风机|周风风机|河南省周口通用风机厂 | 不发火防静电金属骨料_无机磨石_水泥自流平_修补砂浆厂家「圣威特」 | 污水处理设备维修_污水处理工程改造_机械格栅_过滤设备_气浮设备_刮吸泥机_污泥浓缩罐_污水处理设备_污水处理工程-北京龙泉新禹科技有限公司 | 绿叶|绿叶投资|健康产业_绿叶投资集团有限公司 | 海日牌清洗剂-打造带电清洗剂、工业清洗剂等清洗剂国内一线品牌 海外整合营销-独立站营销-社交媒体运营_广州甲壳虫跨境网络服务 | 软启动器-上海能曼电气有限公司| 中图网(原中国图书网):网上书店,尾货特色书店,30万种特价书低至2折! | 工业胀紧套_万向节联轴器_链条-规格齐全-型号选购-非标订做-厂家批发价格-上海乙谛精密机械有限公司 | LED太阳能中国结|发光红灯笼|灯杆造型灯|节日灯|太阳能灯笼|LED路灯杆装饰造型灯-北京中海轩光电 | 礼至家居-全屋定制家具_一站式全屋整装_免费量房设计报价 | 湖南自考_湖南自学考试网 | 权威废金属|废塑料|废纸|废铜|废钢价格|再生资源回收行情报价中心-中废网 | 硫化罐-电加热蒸汽硫化罐生产厂家-山东鑫泰鑫智能装备有限公司 | 中高频感应加热设备|高频淬火设备|超音频感应加热电源|不锈钢管光亮退火机|真空管烤消设备 - 郑州蓝硕工业炉设备有限公司 | 北京遮阳网-防尘盖土网-盖土草坪-迷彩网-防尘网生产厂家-京兴科技 | 消电检公司,消电检价格,北京消电检报告-北京设施检测公司-亿杰(北京)消防工程有限公司 | 品牌策划-品牌设计-济南之式传媒广告有限公司官网-提供品牌整合丨影视创意丨公关活动丨数字营销丨自媒体运营丨数字营销 | 恒温振荡混匀器-微孔板振荡器厂家-多管涡旋混匀器厂家-合肥艾本森(www.17world.net) | 澳洁干洗店加盟-洗衣店干洗连锁「澳洁干洗免费一对一贴心服务」 干洗加盟网-洗衣店品牌排行-干洗设备价格-干洗连锁加盟指南 | 英超直播_英超免费在线高清直播_英超视频在线观看无插件-24直播网 | 东莞市踏板石餐饮管理有限公司_正宗桂林米粉_正宗桂林米粉加盟_桂林米粉加盟费-东莞市棒子桂林米粉 | 矿用履带式平板车|探水钻机|气动架柱式钻机|架柱式液压回转钻机|履带式钻机-启睿探水钻机厂家 | 影像测量仪_三坐标测量机_一键式二次元_全自动影像测量仪-广东妙机精密科技股份有限公司 | 溶氧传感器-pH传感器|哈美顿(hamilton)| 喷涂流水线,涂装流水线,喷漆流水线-山东天意设备科技有限公司 |