`

在js类中 setTimeout() 和 setInterval() 的使用方法详解

    博客分类:
  • HTML
阅读更多

setTimeout(表达式,延迟时间); 单位:ms(毫秒);1s=1000ms; 

  setInterval(表达式,交互时间);  单位:ms(毫秒);1s=1000ms; 

  window.setTimeout()

   在执行时,它从载入后延迟指定的时间去执行一个表达式或者是函数;仅执行一次;和window.clearTimeout一起使用.

  window.setInterval()

   在执行时,它从载入页面后每隔指定的时间执行一个表达式或者是函数;(功能类似于递归函数);和window.clearInterval一起使用.

  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(){
//...
}

  可写为

  setInterval("a()",1000)

  或

  setInterval(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(){
//by 西楼冷月 www.chinacms.org
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'未定义
//下面是第四种 by 西楼冷月 www.chinacms.org
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了

分享到:
评论

相关推荐

    JS中的setTimeout和setInterval的区别JS中的setTimeout和setInterval的区别

    ### JS中的setTimeout与setInterval的区别 在JavaScript编程中,`setTimeout`与`setInterval`是两个非常常用的函数,用于控制代码执行的时间间隔。虽然它们在功能上有一定的相似性,但其实现的效果却大不相同。下面...

    JavaScript中SetInterval与setTimeout的用法详解

    注:调用过程中,可以使用clearTimeout(id_of_settimeout)终止 参数 描述 code 必需,要调用的函数后要执行的 JavaScript 代码串。 millisec 必需,在执行代码前需等待的毫秒数。 setTimeinterval ...

    javascript setTimeout和setInterval计时的区别详解

    JavaScript中的定时器函数setTimeout和setInterval都用于延迟执行代码,但它们的工作方式和用法有所不同。以下是关于这两个函数的详细解析: 1. setTimeout函数的基本概念和用法: setTimeout是JavaScript中的一个...

    JavaScript SetInterval与setTimeout使用方法详解

    setTimeout和setInterval的语法相同。它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码。不过这两个函数还是有区别的,setInterval在执行完...

    给c#添加SetTimeout和SetInterval函数.docx

    本文将详细介绍如何在 C# 中实现类似 JavaScript 的 `setTimeout` 和 `setInterval` 功能,并提供具体的实现代码和注意事项。 #### SetTimeout函数详解 `SetTimeout` 函数的主要作用是在指定的时间间隔后执行一次...

    JS中setTimeout和setInterval的最大延时值详解

    而这篇文中主要给大家介绍的是关于JS中setTimeout和setInterval最大延时值的相关问题,需要的朋友们下面来一起学习学习吧。 先来看这样一段代码: function update() { loadData().then(function(data) { $('#...

    JavaScript定时器setTimeout()和setInterval()详解

    总结来说,`setTimeout()`和`setInterval()`是JavaScript中处理异步编程和动画效果的关键工具。`setTimeout()`用于单次延迟执行,而`setInterval()`用于周期性重复执行。在使用这些定时器时,注意合理安排延迟时间,...

    详解JS中定时器setInterval和setTImeout的this指向问题

    JavaScript中的定时器`setInterval`和`setTimeout`是开发者经常使用的功能,它们允许代码在特定的时间点或间隔执行。这两个函数对于实现动画效果、异步处理等场景非常有用。然而,`this`关键字在这些定时器函数中的...

    【JavaScript源代码】详解CocosCreator中几种计时器的使用方法.docx

    注意,如果在类的方法中使用非箭头函数定义回调,`this`的指向将是`Window`,而不是类实例。因此,推荐使用箭头函数来保持正确的上下文。 2. `setInterval` `setInterval`则会在指定时间间隔后反复执行回调函数,...

    JavaScript_window.setTimeout()_的详细用法

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

    实例讲解JS中setTimeout()的用法

    JavaScript中的`setTimeout()`函数是一个非常重要的异步编程工具,它用于在指定的毫秒数之后执行一次函数或指定的代码块。这个函数对于创建动画效果、定时触发某些操作或者延迟处理事件等场景非常有用。 首先,`...

    javaScript使用详解.pdf

    1. 回调函数:JavaScript的异步处理主要基于回调,如setTimeout、setInterval以及Ajax请求的success或error回调。 2. Promise:ES6引入Promise解决回调地狱问题,它代表一个异步操作的最终完成或失败状态,提供then...

    JavaScript 使用详解

    - **定时器**:setTimeout和setInterval用于延迟执行或周期性执行任务。 4. **面向对象编程** - **构造函数**:用于创建具有特定属性和方法的对象。 - **原型链**:JavaScript中的继承机制,通过原型对象实现...

    JavaScript动态网页开发详解——JavaScript特效

    在“JavaScript动态网页开发详解——JavaScript特效”这一主题中,我们将深入探讨JavaScript如何实现各种炫酷的网页效果。 一、JavaScript基础 在讨论特效之前,我们需要了解JavaScript的基础。JavaScript语法与...

Global site tag (gtag.js) - Google Analytics