精品人妻午夜一区二区三区,美国人在线观看电视剧,动漫欧美亚洲日韩

技術(shù)頻道 - js技術(shù)

setTimeout()如何導(dǎo)致JavaScript內(nèi)存泄漏？怎樣避免？

作者:admin 時(shí)間:2022-6-21 20:4:47 瀏覽:

什么是JavaScript內(nèi)存泄漏？它是如何產(chǎn)生的？我們?cè)撊绾伪苊?？在本文中，我將介紹計(jì)時(shí)器回調(diào)setTimeout()是如何導(dǎo)致JavaScript內(nèi)存泄漏的，然后示例說(shuō)明如何避免。

setTimeout()導(dǎo)致JavaScript內(nèi)存泄漏

JavaScript中有兩個(gè)計(jì)時(shí)事件，即 setTimeout() 和 setInterval()。前者在等待指定的毫秒數(shù)后執(zhí)行一個(gè)函數(shù)，而后者周期性地執(zhí)行一個(gè)函數(shù)（每隔一定的時(shí)間間隔重復(fù)一次）。

當(dāng)任何對(duì)象綁定到計(jì)時(shí)器回調(diào)時(shí)，它不會(huì)被釋放，直到超時(shí)發(fā)生。在這種情況下，計(jì)時(shí)器會(huì)自行重置并永遠(yuǎn)運(yùn)行，直到超時(shí)完成，因?yàn)椴辉试S垃圾收集器刪除內(nèi)存。這些計(jì)時(shí)器是 javascript 中內(nèi)存泄漏的最常見(jiàn)原因。

例子

在以下示例中，計(jì)時(shí)器回調(diào)及其綁定對(duì)象（tiedObject）將在超時(shí)完成之前釋放。與此同時(shí)，計(jì)時(shí)器會(huì)自行重置并永遠(yuǎn)運(yùn)行，因此即使沒(méi)有對(duì)原始對(duì)象的引用，它的內(nèi)存空間也永遠(yuǎn)不會(huì)被收集。

<html>
<body>
<script>
   for (var i = 0; i < 100000; i++) {
   var tiedObject = {
   callAgain: function() {
      var text = this;
      var value = setTimeout(function() {
      text.callAgain();
      }, 100000);
   }
   }
   tiedObject.callAgain();
   tiedObject = null;
   }
</script>
</body>>
</html>

避免內(nèi)存泄漏

1、為避免泄漏，在 setInterval() 或 setTimeout() 中提供引用，以便在執(zhí)行垃圾回收之前需要執(zhí)行函數(shù)。

2、一旦不再需要函數(shù)，就直接調(diào)用刪除函數(shù)。

下面示例顯示如何避免內(nèi)存泄露

HTML

<p>Live Example</p>
<button onclick="delayedAlert();">Show an alert box after two seconds</button>
<p></p>
<button onclick="clearAlert();">Cancel alert before it happens</button>

JavaScript

var timeoutID;
delayedAlert();

function delayedAlert() {
  timeoutID = window.setTimeout(slowAlert, 2000);
}

function slowAlert() {
  alert("That was really slow!");
  clearAlert();
}

function clearAlert() {
  window.clearTimeout(timeoutID);
}

結(jié)果展示

demo download

解釋

示例中，在網(wǎng)頁(yè)設(shè)置了兩個(gè)簡(jiǎn)單的按鈕，以觸發(fā) setTimeout() 和 clearTimeout() 方法：按下第一個(gè)按鈕會(huì)設(shè)置一個(gè)定時(shí)器，定時(shí)器在 2s 后顯示一個(gè)警告對(duì)話框，并將此次 setTimeout 的定時(shí)器 ID 保存起來(lái)，按下第二個(gè)按鈕可以取消定時(shí)器。

返回值timeoutID是一個(gè)正整數(shù)，表示定時(shí)器的編號(hào)。這個(gè)值可以傳遞給clearTimeout()來(lái)取消該定時(shí)器。

需要注意的是 setTimeout() 和 setInterval() 共用一個(gè)編號(hào)池，技術(shù)上，clearTimeout() 和 clearInterval() 可以互換。但是，為了避免混淆，不要混用取消定時(shí)函數(shù)。

在同一個(gè)對(duì)象上（一個(gè) window 或者 worker），setTimeout()或者setInterval()在后續(xù)的調(diào)用不會(huì)重用同一個(gè)定時(shí)器編號(hào)。但是不同的對(duì)象使用獨(dú)立的編號(hào)池。