首頁 > 開發者 > JavaScript
前兩天有一個朋友問我如何使用JavaScript實現鬧鐘，本以為很簡單，有現成的函數可以使用，但是發現現成的鬧鐘函數setTimeout（）僅僅提供一次定時能力，而朋友需要多次的重複定時。這種需求其實在現實生活中非常的常見，具有廣泛的需求。無奈之下，只能自己動手寫一個簡單的鬧鐘啦。
簡單鬧鐘實現程式如下：
<html><br /><head><br /><mce:script type="text/javascript"><!--<br />var timer_count = 0;<br />var timer_is_on = false;<br />var timer_id;<br />function do_alarm()<br />{<br />document.getElementById( 'count' ).value = timer_count;<br />++ timer_count;<br />}<br />function do_timeout( timeout )<br />{<br />do_alarm();<br />timer_id = setTimeout( "do_timeout( " + timeout + " )", timeout );<br />}<br />function start_timer( timeout )<br />{<br />if ( !timer_is_on )<br />{<br />timer_window = window;<br />timer_is_on = true;<br />do_timeout( timeout );<br />}<br />}<br />function stop_timer()<br />{<br />if ( timer_is_on )<br />{<br />clearTimeout( timer_id );<br />timer_is_on = true;<br />timer_count = 0;<br />}<br />}<br />// --></mce:script><br /></head><br /><body><br /><form><br /><input type="button" value="Start Timer!" onClick="start_timer( 1000 )"><br /><input type="button" value="Stop Timer" onClick="stop_timer()"><br /><input type="text" id="count"><br /></form><br /></body><br /></html>
從代碼中我們可以看出：
1）start_timer（）和stop_timer（）是timer兩個r的控制函數。timeout參數主要用於如何設定逾時間隔，已微妙（milliseconds)為單位。
2）do_timeout（）函數主要是通知定時時間已到，並設定下一輪定時時間。
3）do_alarm（）是使用者需要執行的代碼。在代碼中，我們示範了一個定時計數的小小功能一邊使用者有一個直觀的觀察。
它的一個主要缺點是無法支援多個鬧鐘。在實際應用中，它的局限性非常的大，因為複雜的應用對於支援多鬧鐘是非常常見的運用。如何才能實現呢？
1）需要對start_timer和stop_timer進行改動，提供返回不同timer的標識。根據這種標識，應用能夠動態控制鬧鐘的開始和停止。
2）需要提供timer列表，維護不同的timer。
因為上述代碼架構已經比較好的考慮到這點，相信喜歡專研的網友一定能夠比較容易的實現多鬧鐘的情況。在多鬧鐘的實現中，需要注意的是如何維護timer列表的一致性，比如在alarm的時候如何克服使用者刪除操作的影響，如何保證同步等等。
【小結】
- JavaScript提供了簡單的鬧鐘函數setTimeout（），但是它具有局限性（只能定時一次）。
- 本篇文章中提供方案僅僅是一個簡單的鬧鐘，對於複雜需求也是無能為力的，之所以沒有提供一個完備的鬧鐘實現，主要是已經滿足朋友的需求，而無動力再次去完善啦:-)。
- 如果有現成的強大JavaScript庫的話，請最好使用它，畢竟自己寫代碼需要太多的時間和精力，又往往缺乏嚴格的測試，在關鍵的時候以最殘酷的手段呈現在程式員面前。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
