Curs Javascript


Obiectul Date se foloseste pentru a lucra cu data zilei si timpul (ora).

  1. Data initiala 0 (de referinta) este 1-01-1970. Pentru date anterioare are valori negative.
  2. JavaScript retine data si timpul ca un numar de milisecunde incepand de la 1-01-1970.
  3. Cand creati un obiect "Date", ora folosita de obiect este aceea de pe calculatorul client (al vizitatorului).

Creare obiect Date

Data si ora curenta pot fi retinute intr-un obiect Date in JavaScript folosind sintaxa:
var dt = new Date();
- 'dt' poate fi orice nume de variabila.
Iata ce contine acest obiect; testati urmatorul cod:
var dt = new Date();
document.write(dt);
//similar cu: Mon Jul 09 2018 17:54:20 GMT+0300 (GTB Daylight Time)
Dupa ce a fost creat obiectul, se pot folosi metodele acestuia pentru a lucra cu componentele lui referitoare la an, luna, zi, ora, minute, secunde.
Iata doua exemple.

- Preia numarul de milisecunde (cu getTime()) din data curenta si afiseaza timpul Timestamp, adica numarul de secunde de la 1-01-1970 pana acum.
//defineste un obiect Date cu timpul curent
const dt = new Date();

//preia numarul de milisecunde, apoi secundele
let mils = dt.getTime();
let sec = Math.trunc(mils /1000);

//scrie numarul Timestamp
document.write('<p>Numar de secunde de la 1-01-1970 pana acum: '+ sec +'</p>');
- Preia anul (cu getFullYear()), luna (cu getMonth()) si numarul curent al zilei (cu getDate()), apoi le adauga intr-un element HTML in pagina (prima luna are valoarea 0, ultima are valoarea 11).
<p id='dv1'>Anul, luna si numarul silei.</p>

<script>
//array cu numele lunilor
const ar_month =['Ianuarie', 'Februarie', 'Martie', 'Aprilie', 'Mai', 'Iunie', 'Iulie', 'August', 'Septembrie', 'Octombrie', 'Noiembrie', 'Decembrie'];

//defineste un obiect Date cu timpul curent
var dt = new Date();

//preia anul, numarul lunii si al zilei din luna
let year = dt.getFullYear();
let month = dt.getMonth();
let day = dt.getDate();

//adauga in #dv1 luna curenta din 'ar_month' si numarul zilei
document.getElementById('dv1').innerHTML ='Data curenta: '+ year +'-'+ ar_month[month] +'-'+ day;
</script>

Obiect Date cu data si ora specifice

Pentru alte date si ore specifice (fixe), un obiect Date se poate crea in 3 moduri:
new Date(year, month, day, hours, minutes, seconds, milliseconds)
new Date(milliseconds)
new Date('date string')
- In continuare e prezentat pe rand fiecare mod, cu exemple.

new Date(year, month, ...)

Formula new Date(year, month, ...) creaza un obiect Date cu data si timp specific (fix). Poate primi 7 argumente (numere intregi), ultimele 5 sunt optionale.
Sintaxa:
new Date(year, month, day, hours, minutes, seconds, milliseconds)

- Exemple:
var dt = new Date(2018, 7, 21, 11, 35, 20); //Reprezinta: 21 August 2018, Ora 11:35:20
var dt = new Date(98, 0, 8, 9); //Reprezinta: 8 Ianuarie 1998, Ora 9:00:00
var dt = new Date(2019, 11, 25); //Reprezinta: 25 Decembrie 2019

- Exemplu practic. Preia numarul de milisecunde dintr-un obiect cu data fixa si afiseaza timpul Timestamp (numarul de secunde de la 1-01-1970 pana la acea data si ora).
//defineste un obiect Date pt. data 23 Martie 2018, Ora 14:35
const dt = new Date(2018, 2, 23, 14, 35);

//preia numarul de milisecunde, apoi secundele
let mils = dt.getTime();
let sec = Math.trunc(mils /1000); // 1521808500

//scrie numarul Timestamp
document.write('<p>Numar de secunde de la 1-01-1970 pana la 23-Martie-2018, 14:35 este: '+ sec +'</p>');

new Date(milliseconds)

Formula new Date(milliseconds) creaza un obiect Date cu timpul 0 (1970-01-1) plus numarul de milisecunde specificat.
Daca numarul de milisecunde e negativ, data e anterioara anului 1970.
- Exemple:
//obiect Date cu numar de secunde ori 1000 (pt. milisecunde)
const dt = new Date(1521808500 *1000);
document.write('<p>'+ dt +'</p>');
// Fri Mar 23 2018 14:35:00 GMT+0200 (GTB Standard Time)
Cu valoare negativa.
//obiect Date cu numar de secunde ori 1000 (pt. milisecunde)
const dt = new Date(-152180850 *1000);
document.write('<p>'+ dt +'</p>');
// Sat Mar 06 1965 17:32:30 GMT+0200 (GTB Standard Time)

new Date('date string')

Formula new Date('date string') creaza un obiect Date dintr-un sir cu data si ora specificate literar.
Sirul de data poatea avea unul din aceste formate:
new Date('Month DD, YYYY hh:mm:ss'); // Aug 05, 2018 09:25:30
new Date('Month DD YYYY'); // Aug 05 2018
new Date('DD Month YYYY'); // 05 Aug 2018
new Date('YYYY-MM-DD'); // 2018-08-05
new Date('YYYY-MM-DDThh:mm:ss'); // 2018-08-05T09:25:30

- Exemplu, preia si afiseaza numarul de secunde dintre data curenta si un sir cu o alta data si ora.
//obiect cu data curenta
const dt1 = new Date();

//defineste un obiect Date pt. data 23 August 2018, Ora 14:35
const dt2 = new Date('2018-08-25T14:35:00');

//preia diferenta de milisecunde dintre dt1 si dt2
let mils = dt1.getTime() - dt2.getTime();

//retine secundele
let sec = Math.trunc(mils /1000);

//scrie numarul Timestamp
document.write('<p>Numar de secunde de la 23-August-2018, 14:35 pana acum: '+ sec +'</p>');
Obiectul Date contine metode pentru preluarea componentelor din data (an, luna, zi, etc.), dar si pentru adaugare /setare.
O lista cu metode ale obiectului Date gasiti la pagina: marplo.net/javascript/metode-obiect-date

- Exemplu, adauga o ora si 30 minute la data curenta, apoi preia fi afiseaza intr-un element HTML numele zilei din saptamana si ora.
<p id='p1'>Example Date objet in JavaScript</p>

<script>
//array cu zilele din saptamana
const days =['Duminica', 'Luni', 'Marti', 'Miercuri', 'Joi', 'Vineri', 'Sambata'];
var ad_m = 90*60*1000; //o ora si 30 minute in milisecunde

const dt = new Date();

//preia milisecundele din data curenta si adauga ad_m
let mils = dt.getTime();
dt.setTime(mils +ad_m);

//preia ziua din saptamana, ora, minute, secunde
let wday = dt.getDay();
let hour = dt.getHours();
let mins = dt.getMinutes();
let sec = dt.getSeconds();

//afiseaza ora in #p1
document.getElementById('p1').innerHTML ='Ziua si ora peste o ora si 30 minute: <strong>'+ days[wday] +', '+ hour +':'+ mins +':'+ sec +'</strong>';
</script>

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut e folosit in tag-ul <img> pentru adresa imaginii?
href src rel
<img src="http://coursesweb.net/imgs/webcourses.gif" width="191" height="63" alt="Courses-Web" />
Care din aceste coduri CSS ascunde elementul in pagina?
display: none; display: inline; position: relative;
#id {
  display: none;
}
Ce instructiune opreste executia lui while() sau for() ?
continue prompt() break
for(var i = 0; i< 8; i++) {
  if(i > 1) break;
  alert(i);
}
Indicati functia utilizata pentru a crea constante.
define() include() defined()
define("CONSTANT_NAME", "value");
echo CONSTANT_NAME;
Care este forma de plural a substativului "class" (clasa)?
classes clases clasis
This school has three classes.
- Scoala asta are trei clase.
Care este pluralul substativului "voz" (voce)?
vose voze voces
Escuché dos voces.
- Am auzit doua voci.
Obiectul Date - Lucru cu Data si Timp

Last accessed pages

  1. Curs HTML gratuit Tutoriale HTML5 (195356)
  2. Ghiciti Cuvantul (4072)
  3. Cursuri limba engleza gratuite si lectii online (66390)
  4. Cursuri Franceza, Germana, Italiana si Rusa (8088)
  5. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (274999)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1159)
  2. Coduri pt culori (852)
  3. Cursuri limba engleza gratuite si lectii online (542)
  4. Gramatica limbii engleze - Prezentare Generala (495)
  5. Gramatica limbii spaniole. Indrumator si prezentare generala (451)