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
Care tag defineste zona de click intr-o harta creata dintr-o imagine?
<map> <img> <area>
<img src="image.jpg" usemap="#map1">
<map name="map1">
  <area shape="rect" coords="9, 120, 56, 149" href="#">
  <area shape="rect" coords="100, 200, 156, 249" href="#">
</map>
Ce proprietate CSS indica ce sa se intample cand continutul unui element depaseste dimensiunile lui?
display overflow position
#id {
  overflow: auto;
}
Clic pe evenimentul care este declansat cand mouse-ul e deasupra unui obiect.
onclick onmouseover onmouseout
document.getElementById("id").onmouseover = function(){
  document.write("Sa ai Viata Buna");
}
Indicati variabila PHP ce contine datele adaugate in adresa URL, dupa caracterul "?".
$_SESSION $_GET $_POST
if(isset($_GET["id"])) {
  echo $_GET["id"];
}
Clic pe pronumele reflexiv care e potrivit in propozitia: "Marc is the boy ... won the prize".
who which whoever
Marc is the boy who won the prize.
- Marc e baiatul care a castigat premiul.
Clic pe pronumele reflexiv care e potrivit in propozitia: "Voy a ver al pintor de ... les hablé ayer".
que quien cuyo
Voy a ver al pintor de quien les hablé ayer.
- Ma duc sa vad pictorul despre care ti-am vorbit ieri.
Obiectul Date - Lucru cu Data si Timp

Last accessed pages

  1. Conditional IF in Limba Engleza - Fraze Conditionale (119802)
  2. Conditional IF - Exercitii si teste engleza incepatori (20119)
  3. Timpul present (1960)
  4. Cursuri Limba Italiana (6241)
  5. Articolul din limba engleza - The article (66421)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (624)
  2. Conditional IF in Limba Engleza - Fraze Conditionale (540)
  3. Gramatica limbii engleze - Prezentare Generala (439)
  4. Exercitii engleza - English Tests and exercises - Grammar (379)
  5. Coduri pt culori (367)