I have a HTML list of about 500 items and a "filter" box above it. I started by using jQuery to filter the list when I typed a letter (timing code added later): $('#filter').keyup( function() { var jqStart = (new Date).getTime(); var search = $(this).val().toLowerCase(); var $list = $('ul.ablist > li'); $list.each( function() { if ( $(this).text().toLowerCase().indexOf(search) === -1 ) $(this).hide(); else $(this).show(); } ); console.log('Time: ' + ((new Date).getTime() - jqStart)); } ); However, there was a couple of seconds delay after typing each letter (particularly the first letter). So I thought it may be slightly quicker if I used plain Javascript (I read recently that jQuery's each function is particularly slow). Here's my JS equivalent: document.getElementById('filter').addEventListener( 'keyup', function () { var jsStart = (new Date).getTime()...
You can use the setTimeout or setInterval functions.
ReplyDeleteIf you are looking to block the execution of code with call to 'sleep', then no, there is no method for that in JavaScript.
ReplyDeleteJavaScript does have setTimeout method. setTimeout will let you defer execution of a function for x milliseconds. E.g.
setTimeout(myFunction, 3000);// if you have defined a function named myFunction it will run after 3 seconds (3000 milliseconds)
Remember, this is completely different from how 'sleep' method, if it existed, would behave.
function test1()
{
//some code
//Let's say JS did have a sleep function.
sleep(3000); //sleep for 3 seconds,
alert('hi');
}
If you run the above function, you will have to wait for 3 seconds (sleep method call is blocking) before you see the alert 'hi'. Unfortunately, there is no sleep function like that in JavaScript.
function test2()
{
setTimeout(function() { alert('hello');}, 3000); //defer the execution of anonymous function for 3 seconds and go to next line of code.
alert('hi');
}
If you run test2, you will see 'hi' right away (setTimeout is non blocking) and after 3 seconds you will see the alert 'hello'.
f you run the above function, you will have to wait for 3 seconds (sleep method call is blocking)
ReplyDelete<strong class="highlight">function</strong> myFunction(){
doSomething();
wait(500);
doSomethingElse();
}
<html>
<head>
<script type="text/javascript">
/**
* Delay for a number of milliseconds
*/
function sleep(delay) {
var start = new Date().getTime();
while (new Date().getTime() < start + delay);
}
</script>
</head>
<body>
<h1>Eureka!</h1>
<script type="text/javascript">
alert("Wait for 5 seconds.");
sleep(5000)
alert("5 seconds passed.");
</script>
</body>
</html>