`
dreamoftch
  • 浏览: 495684 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

JavaScript window.setTimeout() 的详细用法

阅读更多
setTimeout (表达式,延时时间)
setTimeout(表达式,交互时间)
延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTimeout 在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次
setTimeout 在执行时,它从载入后,每隔指定的时间就执行一次表达式

1,基本用法:
执行一段代码:
复制代码 代码如下:

var i=0;
setTimeout("i+=1;alert(i)",1000);

执行一个函数:
复制代码 代码如下:

var i=0;
setTimeout(function(){i+=1;alert(i);},1000);

//注意比较上面的两种方法的不同。

下面再来一个执行函数的:
复制代码 代码如下:

var i=0;
function test(){
i+=1;
alert(i);
}
setTimeout("test()",1000);

也可以这样:
复制代码 代码如下:

setTimeout(test,1000);

总结:
setTimeout的原型是这样的:
iTimerID = window.setTimeout(vCode, iMilliSeconds [, sLanguage])

setTimeout有两种形式

setTimeout(code,interval)
setTimeout(func,interval,args)

其中code是一个字符串
func是一个函数.

注意"函数"的意义,是一个表达式,而不是一个语句.
比如你想周期性执行一个函数
function a(){
//...
}
可写为
setTimeout("a()",1000)

setTimeout(a,1000)

这里注意第二种形式中,是a,不要写成a(),切记!!!
展开来说,不管你这里写的是什么,如果是一个变量,一定是一个指向某函数的变量;如果是个函数,那它的返回值就 要是个函数

2,用setTimeout实现setInterval的功能
思路很简单,就是在一个函数中调用不停执行自己,有点像递归
复制代码 代码如下:

var i=0;
function xilou(){
i+=1;
if(i>10){alert(i);return;}
setTimeout("xilou()",1000);
//用这个也可以
//setTimeout(xilou,1000);
}

3,在类中使用setTimeout
终于到正题了,其实在类中使用大家遇到的问题都是关于this的,只要解决了这个this的问题就万事无忧了。
呵呵。让我们来分析一下:
复制代码 代码如下:

function xilou(){

this.name="xilou";
this.sex="男";
this.num=0;
}
xilou.prototype.count=function(){
this.num+=1;
alert(this.num);
if(this.num>10){return;}
//下面用四种方法测试,一个一个轮流测试。
setTimeout("this.count()",1000);//A:当下面的x.count()调用时会发生错误:对象不支持此属性或方法。
setTimeout("count()",1000);//B:错误显示:缺少对象
setTimeout(count,1000);//C:错误显示:'count'未定义
//下面是第四种
var self=this;
setTimeout(function(){self.count();},1000);//D:正确

}

var x=new xilou();
x.count();

错误分析:
A:中的this其实指是window对象,并不是指当前实例对象
B:和C:中的count()和count其实指的是单独的一个名为count()的函数,但也可以是window.count(),因为window.count()可以省略为count()
D:将变量self指向当前实例对象,这样js解析引擎就不会混肴this指的是谁了。

话说回来,虽然我们知道setTimeout("this.count()",1000)中的this指的是window对象,但还是不明白为什么会是
window对象^_^(有点头晕...)
那我们可以想象一下这个setTimeout是怎样被定义的:
setTimeout是window的一个方法,全称是这样的:window.setTimeout()
那应该是这样被定义的:
复制代码 代码如下:

window.setTimeout=function(vCode, iMilliSeconds [, sLanguage]){
//.....代码
return timer//返回一个标记符
}

所以当向setTimeout()传入this的时候,当然指的是它所属的当前对象window了
分享到:
评论

相关推荐

    JavaScript_window.setTimeout()_的详细用法

    ### JavaScript中的`window.setTimeout()`详解 #### 一、概述 在JavaScript编程中,`window.setTimeout()`函数是一个非常重要的异步编程工具,它允许开发者在指定的时间后执行特定的代码片段。这一特性对于实现...

    window.open最大化操作

    Window.open最大化操作 在Web开发中,我们经常需要弹出新的浏览器窗口,而在某些...然而,使用window.open方法来实现窗口的最大化需要使用setTimeout方法来延迟执行JavaScript代码,以便在子页面中实现窗口的最大化。

    精解window.setTimeout()&window.setInterval()使用方式与参数传递问题!

    本文将详细讲解window.setTimeout()和window.setInterval()的使用方式,并着重分析在不同场景下的参数传递问题。 首先,我们来看setTimeout和setInterval的基本用法。setTimeout方法用于将某个函数推迟执行一定的...

    JavaScript中window.open用法实例详解

    下面我们将详细探讨`window.open()`的使用方法及其相关参数。 `window.open()`的基本语法如下: ```javascript window.open(url, name, features); ``` - `url`:这是一个必需的参数,表示要打开的网页URL。 - `...

    jsWindow对象及方法.pdf

    - window.clearTimeout():此方法用于取消之前使用setTimeout()设置的定时器。 - window.setInterval():此方法用于按照指定的周期(以毫秒为单位)周期性地执行一个代码段。 - window.clearInterval():此方法用于...

    js中SetInterval与setTimeout用法

    如果在延时期限到达之前取消延执行,可以使用 `window.clearTimeout(timeoutId)` 方法,该方法接收一个 id,表示一个定时器。例如: ```javascript function hello() { alert("hello"); } var id = window....

    javascript Window及document对象详细整理

    JavaScript中的Window对象是全局对象,它是每个...理解并熟练掌握Window对象及其成员对象的使用,是进行JavaScript网页开发的基础,它们可以帮助开发者实现与用户的交互,控制页面行为,并获取有关用户环境的详细信息。

    use-set-safe-timeout:提供“window.setTimeout”版本的 React 钩子可以清除卸载时的超时

    使用设置安全超时 一个React钩子,提供window.setTimeout的版本,该版本在卸载时会自行清除。 消除了不必担心在 React 组件中手动清除卸载超时的开销。 特征 提供可以像window.setTimeout一样调用的回调。 调用时...

    解决window.opener=null;window.close(),只支持IE6不支持IE7,IE8的问题

    `window.opener` 是JavaScript中的一个属性,它引用了创建当前窗口的窗口对象。在用户通过一个链接或脚本打开新窗口后,新窗口可以通过 `window.opener` 访问到打开它的父窗口。而 `window.close()` 方法则用于关闭...

    window对象的常用方法和作用

    本篇将详细阐述window对象的一些常用方法及其作用。 1. **open方法** `window.open(URL, 窗口名称, 窗口风格)` 用于打开新的浏览器窗口。`URL`参数指定要加载的页面地址,`窗口名称`可选,用于指定新窗口的名称或...

    JavaScript.docset,配合zeal使用

    在Zeal中,你可以通过搜索特定的JavaScript函数或对象来查看其详细的使用方法、参数和返回值,帮助你更好地理解和使用JavaScript。同时,Zeal的界面简洁,文档结构清晰,方便开发者快速定位所需信息,是提升前端开发...

    IFrame AND window对象

    `IFrame`的基本使用方法如下: ```html <iframe src="http://example.com" width="600" height="400"></iframe> ``` 其中,`src`属性定义了要加载的URL,`width`和`height`定义了`IFrame`的尺寸。 接下来,我们谈谈...

    javascript对象、属性

    ### JavaScript对象与属性详解 ...以上就是关于`Document`、`Window`、`Date`、`History`和`Location`对象的一些常见方法和属性的详细介绍。这些内容对于理解和掌握JavaScript的基本操作至关重要。

    jsWindow对象及方法[归类].pdf

    JavaScript中的`window`对象是浏览器环境中最核心的对象之一,它代表了浏览器的主窗口或者打开的每一个新的...了解并熟练使用`window`对象是JavaScript客户端开发的基础,可以帮助开发者实现丰富的用户交互和页面控制。

    window.open不被拦截的简单实现代码(推荐)

    在JavaScript编程中,`window.open()` 是一个非常重要的函数,用于在浏览器中打开新的窗口或者重定向当前窗口到指定URL。然而,出于用户体验和安全考虑,现代浏览器通常会对无用户交互的自动弹窗进行拦截,以防止...

    window对象方法属性全解

    了解并熟练掌握Window对象的方法和属性,可以帮助开发者编写出性能更高、更简洁的JavaScript代码。 Window对象拥有众多方法,其中最常用的一些包括: 1. `open`方法:用于打开新的浏览器窗口,例如`window.open...

    JavascriptAPI.rar_javascriptAPI手册_javascriptapi

    比如,`window.location`对象可以读取或改变当前页面的URL,`window.setTimeout`则可以设置延迟执行的函数。 现代JavaScript API,如Web Storage(localStorage和sessionStorage)提供了在浏览器端持久存储数据的...

Global site tag (gtag.js) - Google Analytics