微信小程序—setTimeOut定時(shí)器的問題及解決

背景

實(shí)驗(yàn)室需要將項(xiàng)目的app搬到微信的小程序上，終于知道為什么程序員是手藝人了，只要有需求，就要想方設(shè)法去填充這種需求，去年是小程序的元年了可以說，去年冬天一個(gè)叫跳一跳的小程序游戲出現(xiàn)在我的微信中，當(dāng)時(shí)就覺得騰訊是真的牛皮。一時(shí)間很多的軟件小程序版相繼出現(xiàn)，各大微信公眾號(hào)也開始關(guān)聯(lián)小程序。小程序相比于app，有著獨(dú)特的優(yōu)勢(shì)，其中最大的就是沒有ios和android平臺(tái)之分，但是同時(shí)也有局限，你給我開發(fā)個(gè)小程序王者榮耀試試。

定時(shí)任務(wù)

微信小程序API中有兩種定時(shí)任務(wù)

• setInterval
• setTimeOut

這兩者都能實(shí)現(xiàn)定時(shí)任務(wù)，比如實(shí)現(xiàn)一個(gè)定時(shí)器，但是建議采用后者setTimeOut,理由是前者并不精確。詳細(xì)請(qǐng)參考

https://www.zhihu.com/question/20479535

setTimeOut用法

不多說直接上：

var timerName = setTimeOut(function() {
	//循環(huán)代碼
}, delay)

這里在循環(huán)代碼處做我們需要循環(huán)處理的邏輯，delay是延遲的毫秒數(shù)，5秒 = 5 * 1000，timerName是返回的定時(shí)器名稱，有什么用，因?yàn)橐∠@個(gè)定時(shí)器就需要給需要給出取消的定時(shí)器名稱

clearTimeOut(timerName)

坑

我有一個(gè)需求是每五秒獲取一次位置

startReportHeart() {
   var timerTem = setTimeout(function () {
     that.heartReport();
   }, app.globalConfig.heart_delay)
   // 保存定時(shí)器name
   that.setData({
     timer: timerTem
   })
 },

heartReport()就是獲取位置信息，這樣的效果是，只執(zhí)行了一次。然后查看了一通資料，發(fā)現(xiàn)這個(gè)setTimeOut只是在delay毫秒之后執(zhí)行代碼，嗦嘎。

那如何才能循環(huán)執(zhí)行呢？——>遞歸登場(chǎng)

好吧，我的遞歸就是(錯(cuò)誤代碼)

startReportHeart() {
   var timerTem = setTimeout(function () {
     that.heartReport();
   }, app.globalConfig.heart_delay)
   // 保存定時(shí)器name
    that.setData({
      timer: timerTem
   })
   })
   that.startReportHeart()
 },

好像沒有毛病啊，自遞歸調(diào)用，嗯，沒毛病，但是，，，，情況就是，瞬間出現(xiàn)了堆棧溢出。哈哈哈哈哈哈哈。。。。。。。
分析:

我在startReportHeart函數(shù)中開啟了一個(gè)timer，5秒后開始執(zhí)行，heartReport獲取位置信息，此時(shí)直接遞歸調(diào)用自己，再開啟一個(gè)timer，我的天，這么愚蠢的代碼，是誰寫的，沒錯(cuò)就是我。手動(dòng)捂臉。

在知道了原因之后，那么如何才能解決呢？我們需要5秒后在一次執(zhí)行，對(duì)就是這個(gè)需求，那么自然就是在timer中調(diào)用自身啊。笨蛋。

正確代碼:

startReportHeart() {
   var timerTem = setTimeout(function () {
     that.heartReport();
     that.startReportHeart()
   }, app.globalConfig.heart_delay)
   // 保存定時(shí)器name
   that.setData({
      timer: timerTem
   })
 },

就這樣完美。

總結(jié)

有的時(shí)候，遇到的坑真的很想打自己一巴掌，但是解決坑的過程，并發(fā)現(xiàn)自己的愚蠢卻是一件非常開心的事呢。這個(gè)過程也是十分的funning呢。

小程序開發(fā)剛開始一周時(shí)間，是的，一周上手，一點(diǎn)一點(diǎn)，現(xiàn)在越來越順手，雖然寫的東西比較low，但是再一次印證了那句話，只有實(shí)踐才是最好的學(xué)習(xí)方式。不要找什么從入門到精通，你會(huì)發(fā)現(xiàn)，這些都會(huì)讓你從入門到放棄。

,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值