Posted in Javascript onMay 08, 2014
function foo() { } setInterval( "foo()", 1000 );
如果使用OO的技术,可以这样,
// constructor function MyObj { function foo() { alert( this.data ); } this.timer = foo; this.data = "Hello"; setInterval( "this.timer()", 1000 ); } function Another() { // create timer when create object var obj = new MyObj(); }
但是,它并不能像你想像的那样工作。原因在于setInterval()这个函数并不能识别this这个变量。一个workaround 的方法可以这样。
function Another() { var obj = nw MyObj(); setInterval( “obj.timer()”, 1000 ); }
显然,它可以正确工作,但如果你是一个完美主义者,你就不会对它满意。幸运的是,可以将这个动作放到构造函数中去,形式上有点变化。
// constructor function MyObj { function foo() { alert( this.data ); } this.timer = foo; this.data = "Hello"; var self = this; setInterval( function() { self.timer(); }, 1000 ); } function Another() { var obj = new MyObj(); }
OK, 通过使用一个闭包,就可以了。至于其中的原因,我想给读者自己去思考。
最后,给一个各种测试case的例子。
<html> <head> <title> Hello Timer </title> <script language = "JScript"> /* * There are 3 classes. * * 1. timer can run and result is ok * 2. timer can run and result is wrong * 3. timer can not run * */ function Obj() { function foo() { alert( this.timer ); } this.timer = foo; // var me = this; var f = function() { me.timer(); }; var f2 = function() { this.timer(); }; // 1st class //setInterval( f, 1000 ); // 3rd class //setInterval( f2, 1000 ); // 2nd class //setInterval( me.timer, 1000 ); //setInterval( this.timer, 1000 ); //setInterval( foo, 1000 ); // 3rd class //setInterval( "this.timer()", 1000 ); //setInterval( "me.timer()", 1000 ); //setInterval( "foo()", 1000 ); } var o = null; function OnClick() { o = new Obj(); // 1st class //setInterval( "o.timer()", 1000 ); setInterval( function() { o.timer(); }, 1000 ); // 2nd class //setInterval( o.timer, 1000 ); } </script> </head> <body> <input type = "button" onclick = "OnClick()" value = "Click me"></input> </body> </html>
在JavaScript中使用timer示例
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@