精解window.setTimeout()&window.setInterval()使用方式與參數(shù)傳遞問題!
更新時間:2007年11月23日 16:58:39 作者:
在使用JScript的時候,我們有時需要間隔的執(zhí)行一個方法,比如用來產(chǎn)生網(wǎng)頁UI動畫特效啥的。這是我們常常會使用方法setInterval或setTimeout,但是由于這兩個方法是由腳本宿主模擬出來的Timer線程,在通過其調(diào)用我們的方法是不能為其傳遞參數(shù)。
我們常用的使用場景是:
window.setTimeout("delayRun()", n);
window.setInterval("intervalRun()", n);
window.setTimeout(delayRun, n);
window.setInterval(intervalRun, n);
顯然強行代參數(shù)的調(diào)用: window.setTimeout("delayRun(param)", n);
window.setInterval("intervalRun(param)", n);
window.setTimeout(delayRun(param), n);
window.setInterval(intervalRun(param), n);
都是錯誤的,因為string literals形式的方法調(diào)用,param必須是全局變量(即window對象上的變量)才行;而function pointer形式的調(diào)用,完全錯誤了,這是把函數(shù)的返回值當(dāng)成了setTimeout/setInterval函數(shù)的參數(shù)了,完全不是我們所望的事情。
解決這個問題的辦法可以使用匿名函數(shù)包裝的方式,在以下scenario中我們這么做:
function foo()
{
var param = 100;
window.setInterval(function()
{
intervalRun(param);
}, 888);
}
function interalRun(times)
{
// todo: depend on times parameter
}
這樣一來,就可以不再依賴于全局變量向delayRun/intervalRun函數(shù)中傳遞參數(shù),畢竟當(dāng)頁面中的全局變量多了以后,會給腳本的開發(fā)、調(diào)試和管理等帶來極大的puzzle。
我們常用的使用場景是:
復(fù)制代碼 代碼如下:
window.setTimeout("delayRun()", n);
window.setInterval("intervalRun()", n);
window.setTimeout(delayRun, n);
window.setInterval(intervalRun, n);
顯然強行代參數(shù)的調(diào)用: window.setTimeout("delayRun(param)", n);
復(fù)制代碼 代碼如下:
window.setInterval("intervalRun(param)", n);
window.setTimeout(delayRun(param), n);
window.setInterval(intervalRun(param), n);
都是錯誤的,因為string literals形式的方法調(diào)用,param必須是全局變量(即window對象上的變量)才行;而function pointer形式的調(diào)用,完全錯誤了,這是把函數(shù)的返回值當(dāng)成了setTimeout/setInterval函數(shù)的參數(shù)了,完全不是我們所望的事情。
解決這個問題的辦法可以使用匿名函數(shù)包裝的方式,在以下scenario中我們這么做:
復(fù)制代碼 代碼如下:
function foo()
{
var param = 100;
window.setInterval(function()
{
intervalRun(param);
}, 888);
}
function interalRun(times)
{
// todo: depend on times parameter
}
您可能感興趣的文章:
相關(guān)文章
微信小程序?qū)崿F(xiàn)商品數(shù)據(jù)聯(lián)動效果
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)商品數(shù)據(jù)聯(lián)動效果,代碼很簡單,直接復(fù)制即可根據(jù)自己的需求去修改,對小程序商品數(shù)據(jù)聯(lián)動實例代碼感興趣的朋友一起看看吧2022-08-08
前端實現(xiàn)文本超出指定行數(shù)顯示"展開"和"收起"效果詳細步驟
本文介紹如何使用JavaScript原生代碼實現(xiàn)文本折疊展開效果,并提供方法指導(dǎo)如何在Vue或React等框架中修改實現(xiàn),詳細介紹了創(chuàng)建整體框架、設(shè)置樣式及利用JS控制元素的步驟,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-10-10
js動態(tài)創(chuàng)建表格,刪除行列的小例子
這篇文章介紹了js動態(tài)創(chuàng)建表格,刪除行列的實例代碼,有需要的朋友可以參考一下2013-07-07

