Samuel Gomez - Accéder à la page d'accueil

Javascript : les dates

Publié le :

Introduction Introduction

Les dates en Javascript sont un peu particulières. En effet, il n’existe pas de type date natif. Javascript utilise le type number pour représenter les dates. En effet, une date est représentée par le nombre de millisecondes écoulées depuis le 1er janvier 1970 à 00:00:00 UTC.

Fonctions de base Fonctions de base

Javascript propose plusieurs méthodes pour manipuler les dates. Voici quelques exemples :

const date = new Date();
console.log(date);
const date = new Date(0);
console.log(date); // Thu Jan 01 1970 01:00:00 GMT+0100 (Central European Standard Time)
const date = new Date('2024-03-26T10:00:00');
console.log(date); // Tue Mar 26 2024 10:00:00 GMT+0100 (Central European Standard Time)

Date.now() Date.now()

La méthode Date.now() renvoie le nombre de millisecondes écoulées depuis le 1er janvier 1970 à 00:00:00 UTC.

const now = Date.now();
console.log(now); // 1679827200000

Date.parse() Date.parse()

La méthode Date.parse() renvoie le nombre de millisecondes écoulées depuis le 1er janvier 1970 à 00:00:00 UTC pour une date donnée.

const date = Date.parse('2024-03-26T10:00:00');
console.log(date); // 1679827200000

Date.UTC() Date.UTC()

La méthode Date.UTC() renvoie le nombre de millisecondes écoulées depuis le 1er janvier 1970 à 00:00:00 UTC pour une date donnée.

const date = Date.UTC(2024, 2, 26, 10, 0, 0);
console.log(date); // 1679827200000

Les getters Date Les getters Date

Date.getTime() Date.getTime()

La méthode Date.getTime() renvoie le nombre de millisecondes écoulées depuis le 1er janvier 1970 à 00:00:00 UTC pour une date donnée.

const date = new Date('2024-03-26T10:00:00');
console.log(date.getTime()); // 1679827200000

Date.getTimezoneOffset() Date.getTimezoneOffset()

La méthode Date.getTimezoneOffset() renvoie le décalage horaire en minutes entre la date donnée et UTC.

const date = new Date('2024-03-26T10:00:00');
console.log(date.getTimezoneOffset()); // -60

Date.getFullYear() Date.getFullYear()

La méthode Date.getFullYear() renvoie l’année de la date donnée.

const date = new Date('2024-03-26T10:00:00');
console.log(date.getFullYear()); // 2024

Date.getMonth() Date.getMonth()

La méthode Date.getMonth() renvoie le mois de la date donnée (0-11).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getMonth()); // 2

Date.getDate() Date.getDate()

La méthode Date.getDate() renvoie le jour du mois de la date donnée (1-31).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getDate()); // 26

Date.getDay() Date.getDay()

La méthode Date.getDay() renvoie le jour de la semaine de la date donnée (0-6).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getDay()); // 2

Date.getHours() Date.getHours()

La méthode Date.getHours() renvoie l’heure de la date donnée (0-23).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getHours()); // 10

Date.getMinutes() Date.getMinutes()

La méthode Date.getMinutes() renvoie les minutes de la date donnée (0-59).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getMinutes()); // 0

Date.getSeconds() Date.getSeconds()

La méthode Date.getSeconds() renvoie les secondes de la date donnée (0-59).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getSeconds()); // 0

Date.getMilliseconds() Date.getMilliseconds()

La méthode Date.getMilliseconds() renvoie les millisecondes de la date donnée (0-999).

const date = new Date('2024-03-26T10:00:00');
console.log(date.getMilliseconds()); // 0

Date.getTimezoneOffset() Date.getTimezoneOffset()

La méthode Date.getTimezoneOffset() renvoie le décalage horaire en minutes entre la date donnée et UTC.

const date = new Date('2024-03-26T10:00:00');
console.log(date.getTimezoneOffset()); // -60

Les setters Date Les setters Date

Date.setFullYear() Date.setFullYear()

La méthode Date.setFullYear() permet de définir l’année de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setFullYear(2025);
console.log(date); // Wed Mar 26 2025 10:00:00 GMT+0100 (Central European Standard Time)

Date.setMonth() Date.setMonth()

La méthode Date.setMonth() permet de définir le mois de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setMonth(4);
console.log(date); // Tue May 26 2024 10:00:00 GMT+0100 (Central European Standard Time)

Date.setDate() Date.setDate()

La méthode Date.setDate() permet de définir le jour du mois de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setDate(15);
console.log(date); // Fri Mar 15 2024 10:00:00 GMT+0100 (Central European Standard Time)

Date.setHours() Date.setHours()

La méthode Date.setHours() permet de définir l’heure de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setHours(15);
console.log(date); // Tue Mar 26 2024 15:00:00 GMT+0100 (Central European Standard Time)

Date.setMinutes() Date.setMinutes()

La méthode Date.setMinutes() permet de définir les minutes de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setMinutes(30);
console.log(date); // Tue Mar 26 2024 10:30:00 GMT+0100 (Central European Standard Time)

Date.setSeconds() Date.setSeconds()

La méthode Date.setSeconds() permet de définir les secondes de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setSeconds(30);
console.log(date); // Tue Mar 26 2024 10:00:30 GMT+0100 (Central European Standard Time)

Date.setMilliseconds() Date.setMilliseconds()

La méthode Date.setMilliseconds() permet de définir les millisecondes de la date donnée.

const date = new Date('2024-03-26T10:00:00');
date.setMilliseconds(500);
console.log(date); // Tue Mar 26 2024 10:00:00 GMT+0100 (Central European Standard Time)

Date.setTimezoneOffset() Date.setTimezoneOffset()

La méthode Date.setTimezoneOffset() permet de définir le décalage horaire en minutes entre la date donnée et UTC.

const date = new Date('2024-03-26T10:00:00');
date.setTimezoneOffset(-120);
console.log(date); // Tue Mar 26 2024 12:00:00 GMT+0200 (Central European Summer Time)

Changement de formats Changement de formats

Date.toString() Date.toString()

La méthode Date.toString() renvoie une chaîne de caractères représentant la date donnée.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toString()); // Tue Mar 26 2024 10:00:00 GMT+0100 (Central European Standard Time)

Date.toISOString() Date.toISOString()

La méthode Date.toISOString() renvoie une chaîne de caractères représentant la date donnée au format ISO 8601.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toISOString()); // 2024-03-26T09:00:00.000Z

Date.toUTCString() Date.toUTCString()

La méthode Date.toUTCString() renvoie une chaîne de caractères représentant la date donnée au format UTC.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toUTCString()); // Tue, 26 Mar 2024 09:00:00 GMT

Date.toLocaleString() Date.toLocaleString()

La méthode Date.toLocaleString() renvoie une chaîne de caractères représentant la date donnée au format local.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toLocaleString()); // 26/03/2024, 10:00:00

Date.toLocaleDateString() Date.toLocaleDateString()

La méthode Date.toLocaleDateString() renvoie une chaîne de caractères représentant la date donnée au format local sans l’heure.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toLocaleDateString()); // 26/03/2024

Date.toLocaleTimeString() Date.toLocaleTimeString()

La méthode Date.toLocaleTimeString() renvoie une chaîne de caractères représentant l’heure de la date donnée au format local sans la date.

const date = new Date('2024-03-26T10:00:00');
console.log(date.toLocaleTimeString()); // 10:00:00

Intl Intl

La classe Intl.DateTimeFormat permet de formater les dates en fonction de la locale. Voici quelques exemples de formatage de dates en utilisant l’API Intl.

La méthode <code>format()</code> La méthode format()

La méthode format permet de formater les dates en fonction de la locale et des options fournies.

const date = new Date('2024-03-26T10:00:00');
const formatter = new Intl.DateTimeFormat('fr-FR', {
  year: 'numeric',
  month: 'long',
  day: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  second: 'numeric',
});
console.log(formatter.format(date)); // 26 mars 2024 à 10:00:00

Avec l’option timeZoneName, vous pouvez afficher le nom du fuseau horaire.

const date = new Date('2024-03-26T10:00:00');
const formatter = new Intl.DateTimeFormat('fr-FR', {
  year: '2-digit',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit',
  timeZoneName: 'long',
});
console.log(formatter.format(date)); // 26/03/24, 10:00:00 GMT+01:00

La méthode <code>formatToParts()</code> La méthode formatToParts()

La méthode formatToParts() permet de formater les dates en fonction de la locale et de récupérer les différentes parties de la date.

const date = new Date('2024-03-26T10:00:00');
const formatter = new Intl.DateTimeFormat('fr-FR', {
  year: '2-digit',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit',
  timeZoneName: 'short',
});
console.log(formatter.formatToParts(date));
//[
//  { type: 'day', value: '26' },
//  { type: 'literal', value: '/' },
//  { type: 'month', value: '03' },
//  { type: 'literal', value: '/' },
//  { type: 'year', value: '24' },
//  { type: 'literal', value: ', ' },
//  { type: 'hour', value: '10' },
//  { type: 'literal', value: ':' },
//  { type: 'minute', value: '00' },
//  { type: 'literal', value: ':' },
//  { type: 'second', value: '00' },
//  { type: 'literal', value: ' GMT+1' },
//];

La méthode <code>resolvedOptions()</code> La méthode resolvedOptions()

La méthode resolvedOptions() permet de récupérer les options utilisées pour formater la date.

const date = new Date('2024-03-26T10:00:00');
const formatter = new Intl.DateTimeFormat('fr-FR', {
  year: '2-digit',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit',
  timeZoneName: 'short',
});
console.log(formatter.resolvedOptions());
// [
//   {
//     locale: 'fr-FR',
//     timeZone: 'Europe/Paris',
//     hour12: false,
//     year: '2-digit',
//     month: '2-digit',
//     day: '2-digit',
//     hour: '2-digit',
//     minute: '2-digit',
//     second: '2-digit',
//     timeZoneName: 'short',
//   },
// ];
Tous les articles de Javascript
Github de Samuel Gomez Linkedin de Samuel Gomez Twitter de Samuel Gomez Instagram de Samuel Gomez
Allez en haut