`
jolestar
  • 浏览: 197165 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Javascript对象中使用setTimeout和setInterval的问题

阅读更多

       前两天写一个js时遇到个问题。就是在js对象内部如果用setTimeout或者setInterval调用该对象的一个方法,然后在被调用方法中就无法使用this获取该对象。因为经过setTimeout调用后,this就成了浏览器了,原来那个对象就丢失了。

      如:

js 代码
  1. function TestObj(){   
  2.     this.property = "test";   
  3.     this.called = function(){   
  4.         alert(this.property);   
  5.     }   
  6.     this.setTimeCall = function(){   
  7.         setTimeout(this.called,500);   
  8.     }   
  9. }   
  10.   
  11. var test = new TestObj();   
  12. test.setTimeCall();  

      如果直接调用test.called方法是没有问题的。但如果通过setTimeout调用,也就是调用test.setTimeCall(),this.property就为空了。因为这里的this成浏览器了。同样的问题也发生在监听浏览器的其他事件上。没办法,于是用了个比较糟糕的办法。

 

  1. function TestObj(){   
  2.     this.property = "test";   
  3.     this.called = function(){   
  4.         alert(this.property);   
  5.     }   
  6.     this.setTimeCall = function(){   
  7.         setTimeout("test.called()",500);   
  8.     }   
  9. }   
  10.   
  11. var test = new TestObj();   
  12. test.setTimeCall();  

 之所以说这样做糟糕,是因为在定义TestObj时,就必须提前知道TestObj被创建时的变量名。后来在IBM社区看到一篇探讨javascript有限状态机的文章,用了一个很巧妙的办法避免这个问题。

js 代码
  1.  function TestObj(){   
  2.     this.property = "test";   
  3.     var self = this;   
  4.     this.called = function(){   
  5.         alert(self.property);   
  6.     }   
  7.        
  8.     this.setTimeCall = function(){   
  9.         setTimeout(self.called,500);   
  10.     }   
  11. }   
  12.   
  13. var test = new TestObj();   
  14. test.called();   
  15. test.setTimeCall();  

在TestObj中定义一个变量,self,然后指向this。这样用self调用this,就不会发生和浏览器的this对象冲突的问题了。

 虽然是很简单的一个问题,但有时候人脑子转不过弯也没办法。

分享到:
评论
1 楼 delphidoc 2007-08-03  
还有更好的办法:
function TestObj(){  

    this.called = function(){  
        alert("OK");  
    }  
      
    this.setTimeCall = function(){  
        setTimeout(this.called.bind(this),500);  
    }  
}  

相关推荐

    Javascript中, setTimeout() 和 setInterval() 的方法

    总之,`setTimeout()`和`setInterval()`是JavaScript中用于处理时间调度的核心工具,它们的正确使用对于编写健壮的前端应用至关重要。理解它们的工作机制,并根据需求选择合适的函数,能够帮助开发者更好地控制代码...

    Javascript中setTimeOut和setInterval的定时器用法

    Javascript的setTimeOut和setInterval函数应用非常广泛,它们都用来处理延时和定时任务,比如打开网页一段时间后弹出一个登录框,页面每隔一段时间发送异步请求获取最新数据等等。但它们的应用是有区别的。 ...

    Javascript定时器(二)——setTimeout与setInterval

    JavaScript定时器是编程中不...总之,理解并正确使用`setTimeout`和`setInterval`是JavaScript开发中的基础技能。它们可以帮助我们实现延迟执行、定时执行和周期性执行等功能,但同时也需要谨慎处理以防止潜在的问题。

    关于JS定时器(setTimeout setInterval)定时不准问题1

    在JavaScript中,setTimeout和setInterval是两个基本的定时器函数,用于实现延迟执行或循环执行某个函数。然而,这两个函数在执行时往往和我们设置的延迟时间有出入。本文将深入探讨JS定时器的执行机制,分析why ...

    Javascript对象中关于setTimeout和setInterval的this介绍

    在Javascript里,setTimeout和setInterval接收第一个参数是一个字符串或者一个函数,当在一个对象里面用setTimeout延时调用该对象的方法时 代码如下: function obj() { this.fn = function() { alert(...

    javascript之setTimeOut和setInterval的用法

    使用SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再进行某项操作。

    JavaScript中setTimeout和setInterval函数的传参及调用_.docx

    JavaScript 中 setTimeout 和 setInterval 函数的传参及调用 在 JavaScript 中,setTimeout 和 setInterval 函数都是用于在指定的时间点执行某个函数的,但是它们的传参方式和调用方式却有所不同。 setTimeout ...

    JavaScript定时器:`setTimeout`和`setInterval`的深入指南

    setTimeout和setInterval是JavaScript中两个基本的定时器函数,它们在前端开发中有着广泛的应用。本文将详细介绍这两个函数的使用方法、差异、以及如何在实际项目中有效利用它们。 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中的一个...

    cpp-timercpp为C开发提供类似于Javascript中的setTimeout和setInterval功能

    `timercpp` 是一个C++库,它的主要目的是为C++开发者提供类似于JavaScript中的`setTimeout`和`setInterval`这两个函数的功能。在JavaScript中,`setTimeout`用于在指定的时间后执行一次回调函数,而`setInterval`则...

    理解javascript定时器中的setTimeout与setInterval

    本文将深入讲解JavaScript中的两个重要定时器函数:`setTimeout`和`setInterval`。 首先,`setTimeout`函数用于在指定延迟时间后执行一次函数或代码片段。其基本语法如下: ```javascript var timeoutID = window....

    setTimeout和setInterval的区别

    在JavaScript中,定时执行任务是通过`setTimeout`和`setInterval`这两个函数来实现的。它们都是用于在指定延迟后执行代码,但它们之间存在显著的区别。 `setTimeout`函数用于在给定的`DelayTime`(延迟时间)过后...

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

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

    JavaScript中从setTimeout与setInterval到AJAX异步

    在JavaScript中,setTimeout和setInterval是两种常见的定时器函数,用于实现异步操作。JavaScript作为单线程语言,其主线程的执行是顺序的,但是在处理某些操作,如延时任务或者周期任务时,会借助事件循环机制和回...

    JavaScript setTimeout和setInterval的使用方法 说明

    - 不要在setTimeout或setInterval中使用字符串形式的代码,这种方式容易造成代码注入的安全隐患。推荐使用函数引用的方式。 综上所述,setTimeout和setInterval是JavaScript中实现定时任务的两个常用方法。...

    javascript setTimeout和setInterval 的区别

    JavaScript中的`setTimeout`和`setInterval`是两个重要的定时器函数,它们都属于全局`window`对象的方法,常用于在指定的时间后执行某段代码或周期性地重复执行某段代码。然而,它们的工作机制和用途有所不同。 1. ...

    JavaScript中setTimeout和setInterval函数的传参及调用

    在JavaScript编程中,我们经常需要处理时间延迟或周期性任务执行的需求,这时会用到setTimeout和setInterval这两个全局函数。 setTimeout函数用于在指定的毫秒数后执行一次代码块,而setInterval则用于每隔指定的...

Global site tag (gtag.js) - Google Analytics