Strona główna HTML i javascript C++ Hardware HTML i javascript Java Software SQL flag_united_kingdom flag_poland

Javascript - function sleep, my implementation.

Added: 2011-10-15

The JavaScript programming language, there is no function sleep(), but there is a simplified equivalent function setTimeout().

Many people think that in javascript, there is no good reason for the existence of the sleep(), because there is no good reason to use it if there are other methods that give the same result without using the sleep().

When creating scripts in javascript, you may encounter with the situation when a setTimeout() is not fully satisfactory.

The best is an example. In some situations programist, want that function was invoked one after the other with some delay.

// pseudo code
function start(){

	fun01();
	sleep(1000);
	fun02();
	sleep(1000);
	fun03();
}

Javascript:

function fun01(){
	document.getElementById('TEMP').innerHTML += "fun01(); 
"; setTimeout(function(){fun02();}, 1000); } function fun02(){ document.getElementById('TEMP').innerHTML += "fun02();
"; setTimeout(function(){fun03();}, 1000); } function fun03(){ document.getElementById('TEMP').innerHTML += "fun03();
"; } function start(){ fun01(); }

This requires a lot of extra code that does not become clear, is not always possible to modify other functions.To facilitate the launch function at certain intervals, it is a good idea to create a class that implements the sleep().

“Class” jsSleep() runs function at certain intervals in easy way.You must first create object class jsSleep(), next use method setFunction([nameFunction], timeToWaitInMs), and add function name whose you want run in at certain intervals times. After that you can run method sleep([objectJsSleep]). Below is “class”:

Print Select code
jsSleep.js
// autohor lis 
function jssleep(){

	function init(){
		nextElemNum = 0;
		checkedElemNum = 0;
		arrFun = new Array();
	}

	this.setFunction = function(nameFunction, sleepTime){
		arrFun[nextElemNum] = new Array(2);
		arrFun[nextElemNum][0] = nameFunction;
		arrFun[nextElemNum][1] = sleepTime;
		nextElemNum++;		
	}

	this.getElement = function(num){
		return arrFun[num][0] + "; " + arrFun[num][1];
	}

	this.getElementOnPos = function(num, pos){
		return arrFun[num][pos];
	}


	this.getNextElemNum = function(){
		return nextElemNum;
	}

	this.getCheckedElemNum = function(){
		return checkedElemNum;
	}

	this.setCheckedElemNum = function(addNum){
		temp = checkedElemNum;
		checkedElemNum += addNum;
		return temp;
	}

	this.runFunction = function(numberInArray){
		arrFun[numberInArray][0]();
	}


	var nextElemNum;
	var checkedElemNum;
	var arrFun;

	// blok inicjujący
	init();
}

jsSleep.prototype = {
	sleep: function(jsClass){
		if (this.getCheckedElemNum() != this.getNextElemNum){
			this.runFunction(this.getCheckedElemNum());
			 setTimeout(function(){jsClass.sleep(jsClass);}, 

this.getElementOnPos(this.setCheckedElemNum(1), 1));
		}

	}
}

Example:

Print Select code
jsSleep_test.htm
<html>
<head>
<script type="text/javascript">

// autohor lis 
function jssleep(){

	function init(){
		nextElemNum = 0;
		checkedElemNum = 0;
		arrFun = new Array();
	}

	this.setFunction = function(nameFunction, sleepTime){
		arrFun[nextElemNum] = new Array(2);
		arrFun[nextElemNum][0] = nameFunction;
		arrFun[nextElemNum][1] = sleepTime;
		nextElemNum++;		
	}

	this.getElement = function(num){
		return arrFun[num][0] + "; " + arrFun[num][1];
	}

	this.getElementOnPos = function(num, pos){
		return arrFun[num][pos];
	}


	this.getNextElemNum = function(){
		return nextElemNum;
	}

	this.getCheckedElemNum = function(){
		return checkedElemNum;
	}

	this.setCheckedElemNum = function(addNum){
		temp = checkedElemNum;
		checkedElemNum += addNum;
		return temp;
	}

	this.runFunction = function(numberInArray){
		arrFun[numberInArray][0]();
	}


	var nextElemNum;
	var checkedElemNum;
	var arrFun;

	// blok inicjujący
	init();
}

jsSleep.prototype = {
	sleep: function(jsClass){
		if (this.getCheckedElemNum() != this.getNextElemNum){
			this.runFunction(this.getCheckedElemNum());
			 setTimeout(function(){jsClass.sleep(jsClass);}, 

this.getElementOnPos(this.setCheckedElemNum(1), 1));
		}

	}
}


//test

function fun01(){
	document.getElementById('TEMP').innerHTML += "Funkcja fun01!!!<br>";
}

function fun02(){
	document.getElementById('TEMP').innerHTML += "Funkcja fun02!!!<br>";
}

function fun03(){
	document.getElementById('TEMP').innerHTML += "Funkcja fun03!!!<br>";
}

function sleep(){
	sl = new jssleep();
	sl.setFunction(fun01, 1000);
	sl.setFunction(fun02, 1000);
	sl.setFunction(fun03, 2000);
	sl.sleep(sl);
}

</script>
</head>

<body>

<input type="button" onclick="sleep();" value="ok">
<div id="TEMP"></div>

</body>
</html>