您當前位置：首頁 > web前端 > jscript > 避免js無限循環引起的假死或cpu100%

避免js無限循環引起的假死或cpu100%

來源：程序員人生發布時間：2014-04-14 00:46:46 閱讀次數：4497次

　　本文內容很簡單，只是對面試中遇到的一個記不清楚的問題的復習，鑒于是俺第一次在cnblog上發文,所以裝了防護盾，請勿以任何方式扔板磚、菜刀之類物品….

　　今天去國內某知名公司面試了一把，投的職位是前端開發，第一次去大公司面試，受到的感觸當然是十分多多，感觸稍后補齊，整個過程沒啥有難度的技術問題，可能和該公司的產品方向有關吧(補充下，該公司主打不是做web的)。

　　二輪面試的時候，產品經理和我提到了他們產品中遇到的一個問題，大概意思是：他們某個功能，在頁面做無限循環顯示數據的時候，會造成CPU，100%。當時產品經理也只是稍微給我演示了下，因為當時我腦子一直在想，這個問題為啥在自己以前用JS模擬多線程的時候沒有出現，所以對他說的相關的信息也沒注意聽，界面也只是看了個大概，當時我也只提出使用 setTimeout 或 setInterval 來做的話，會避免這個問題，不過距我上次做多線程Demo的日子過的太長，有點模糊了，我也沒有百分百把握，所以回家后趕緊翻出以前的代碼出來整理出答案，如下：

　　代碼簡單，我也就懶得寫注釋了，以下是循環次數和設置DIV innerHTML的2個函數。

以下為引用的內容：
function $(id) {
return document.getElementById(id);
}
var setter = function() {
var ele = $("containder");
return function(count) {
ele.innerHTML = count;
}
}();
var counter = function() {
var count = 0;
return function() {
count++;
setter(count);
};
} ();

　　估計沒人會像測試1 這樣用，瀏覽器直接卡死。

　　Test1：

以下為引用的內容：
<script type="text/javascript">
(function() {
while (1) {
counter();
}
})
();
</script>

　　測試二使用 setInterval 方法，CPU使用量和 IE所占內存都很少，一般CPU就是在0-2%之間，和while 的循環基本能達到同樣的效果。至于為啥出現這樣的原因，小弟不敢妄自猜測，避免誤導新人。希望有了解JS引擎的出來講解講解…

　　Test2:

以下為引用的內容：
<script type="text/javascript">
(function() {
window.setInterval("counter();", 1);
})();
</script>

　　按照產品經理那樣的界面去大概顯示數據,大概是有接口會自動提供數據,前端調用處理字符串就好了…

　　Test3完整代碼:

以下為引用的內容：
<script type="text/javascript">
function $(id) {
return document.getElementById(id);
}
var data = [];
var createdata = function() {
data.push(+new Date() + "|" + (+new Date()));
};
var setter = function() {
var ele = $("containder");
var list = [];
return function(text) {
if (!text)
return;
list.push(text);
if (list.length > 10)
list.shift();
ele.innerHTML = list.join("<br/>");
}
} ();
var counter = function() {
var count = 0;
return function() {
count++;
setter(data.shift());
};
} ();
(function() {
window.setInterval("createdata();", 1);
window.setInterval("counter();", 1);
})
();
</script>

　　本文的第二個目的也是給大家提個醒，其實面試很多時候都是問些基礎的操作.

　　第一次使這東西，感覺挺麻煩.先測試下都...

　　作者：低調的

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈
程序員人生

------分隔線----------------------------

上一篇 Access使用宏控制程序--1.6.使用宏的幾點說明

下一篇 中小企業博客營銷實戰,不談理論談實踐

分享到:

------分隔線----------------------------

為碼而活

積分：4237

15粉絲

7關注

欄目熱點

日本搞逼视频_黄色一级片免费在线观看_色99久久_性明星video另类hd_欧美77_综合在线视频

避免js無限循環引起的假死或cpu100%