Date objektet

Fra HTX Arduino
Spring til navigation Spring til søgning

Opbygningen af Date objektet

Date er en klasse, der definerer ur-funktioner i javaScript, så man kan oprette objekter ud fra denne klasse.

Objektet er koblet sammen med PC'ens ur, og udnytter tiden og kalenderen i uret.

Man kan oprette et objekt der er den aktuelle tid, eller man kan oprette til et tidspunkt man angiver ved oprettelsen.

Metoder i Date objektet

Med objektets metoder kan man så hente mange forskellige oplysninger om tid og dato, og man kan rette i det aktuelle objekt (ikke i PC'ens ur), så man kan få de oplysninger om tiden man ønsker. Der kan findes en total oversigt over alle metoder i Date-klassen kan findes på w3schools hjemmeside[1]

Oprettelse af et Date objekt

Når man opretter et Date objekt lægger man det i en variabel, så man kan arbejde med objektet.

Man kan oprette et Date objekt uden parametre - så tager den PC-ens ur som den tid der skal ligge i objektet. Det gør man på følgende måde:

var nu = new Date();

Hvis man ønsker at oprette til et angivet tidspunkt kan det gøres på forskellige måder f.x.:

var dato = new Date(year, month, day, hours, minutes, seconds, milliseconds);

Anvendelsen af Date objektet

Når man har sit Date objekt oprettet, så kan man trække forskellige oplysninger ud af objektet på følgende måde:

timer = nu.getHours();
minutter = nu.getMinutes();

Man kan også få mere sammensatte output fra som f.x.:

alert(nu.toLocaleString());

Der giver dato og tid efter lokale standarder (indstiller sig efter PC'ens landevalg).

Man kan også få et lidt specielt tal ud, nemlig antallet af millisekunder siden kl. 00:00 den 1/1 1970. Det kan virke lidt underligt, men giver god mening, når man vil bruge det til tidsmåling.

Eksempel der illustrerer tids-forskel

Eksemplet er opbygget omkring en knap, som man skal klikke på to gange lige efter hinanden, og programmet måler så tiden mellem de to klik.

Funktionen der foretager målingen og viser det er vist her:

function registrerKlik () {
	if (klikket) {
		nu = new Date();
		tid = nu.getTime() - firstClick.getTime();
		klikket = false;
		alert("Tiden mellem de to klik var " + tid + " millisekunder");
	} else {
		firstClick = new Date();
		klikket = true;
	}
}

Hele koden kan hentes i denne ZIP-fil, hvor det er koden date-tidsmaal.html

Udvidet eksempel

Det næste eksempel er udvidet lidt, så man kan se hvad der sker, og med et lidt anderledes brugerinterface (der kommer ikke en alert).

Udvidelsen anvender setInterval til sin visning af tiden der løber.

function registrerKlik () {
	if (klikket) {
		var nu = new Date();
		var tid = nu.getTime() - firstClick.getTime();
		klikket = false;
		clearTimeout(timer);
		document.getElementById("tidsVis").value = tid + " millisekunder";
	} else {
		firstClick = new Date();
		klikket = true;
		timer = setInterval("opdater();", 30);
	}
}

Hele koden kan hentes i denne ZIP-fil, hvor det er koden date-tidsmaal2.html

Mere inspiration

Hvis man ønsker mere inspiration til hvordan Date objektet kan anvendes, så er der en god side på w3schools[2]

Referencer

  1. http://w3schools.com/jsref/jsref_obj_date.asp w3schools.com javascript-sektionens forklaring af Date klassen
  2. http://w3schools.com/js/js_obj_date.asp w3schools tutorial om javaScriptDate objektet
Webcode
JavaScript for - while - do while - for in - løkke - løkker i løkker - if - if-else - else-if - Conditional - Switch - break - continue - Funktion - Return - Returværdi - Rekursion - Sekvens - Javascript strukturer
js Input Checkbox - Dropdown - Form - Input button - Input filter - Input password - Input text - Textarea - submit knap - Option - Prompt - Confirm - Radio button - Select - Input-Tag - Keyboard event
js Output Alert - Document.write - Frameset output - Objekt egenskaber - Objekt output - Text-felt til output - Vindue output - Billed egenskaber - Canvas
js Syntaks Arrays - Betingelse - Identifyer - Variabel - Variabel scope - Type - Sekvens
js Objekt Canvas - Billed egenskaber - Egne objekter - Events - HTML-objekter - Keyboard event - Event-handler - Browser detektering - Preload images - Document Object Model
Tid i JavaScript Date objektet - setTimeout - setInterval
PHP Header - Include