css.in.ua
Підтримати

Наповнення JS розділу

Добридень, Пані та Панове, завдяки вам вдалося зібрати більше 19тис грн з необхідних 15тис на впровадження JS розділу.

JS розділ вже впроваджено - переходимо до його наповнення і почнемо бігти довгий марафон, адже JS має більше 1100 різноманітних методів, властивостей, подій і т.д., які необхідно описати.

Будемо працювати, і вдень, і вночі, щоб орієнтовно взимку закінчити наповнювати JS розділ!

Ви також можете допомогти нам в цьому. Долучайтеся до нашої спільноти в дискорді - ставайте її частиною і допомагайте нашому розвитку.

Також, підтримуйте нас матеріально.

Підтримати матеріально

JS метод Date.setDate()

Загальний опис

Date.prototype.setDate() – це метод, вбудований в прототип об'єкта Date. Його основне призначення - це зміна дня місяця для конкретного об'єкта дати. Дуже корисно, коли потрібно внести корективи в існуючий об'єкт дати без створення нового.

Уявімо, що ви розробляєте календарний застосунок або планувальник завдань, де користувачу часто потрібно вибирати або змінювати дати. Date.prototype.setDate() допоможе вам легко адаптувати існуючу дату до нової, не втрачаючи при цьому іншої інформації про час, місяць чи рік.

Приклад: 

let birthday = new Date(1995, 4, 16); // 16 травня 1995 року
console.log(birthday); 
birthday.setDate(20); 
console.log(birthday);

Вище ми створили дату, а потім змінили день місяця на 20. Це простий приклад того, як можна маніпулювати днями.

Date.prototype.setDate() приймає один аргумент - число від 1 до 31, але реакція на значення поза цим діапазоном може бути неочікуваною. Наприклад, якщо ви передасте 0, це перенесе дату на останній день попереднього місяця. При передачі числа, що перевищує кількість днів у місяці, дата "перекочує" на наступний місяць. Наприклад, для травня, якщо ви встановите дату як 32, це автоматично стане 1 червня.

Приклад: 

let exampleDate = new Date(2023, 3, 25); // 25 квітня 2023 року
exampleDate.setDate(32); 
console.log(exampleDate); // 2 травня 2023 року
Порада:

Важливо розуміти, що навіть якщо метод Date.prototype.setDate() приймає значення поза діапазоном (наприклад, 0 або 32+ для більшості місяців), він все одно обробить це значення. Але для уникнення неочікуваних результатів завжди перевіряйте діапазон введення.

Приклад:

let date = new Date(2023, 6, 15); 
if(value >= 1 && value <= 31) {
    date.setDate(value);
} else {
    console.warn('Недопустиме значення для дня місяця!');
}
Порада:

Якщо вам потрібно внести зміни до дати, але при цьому зберегти оригінальний об'єкт Date, завжди працюйте з його копією. Так ви уникнете непотрібних мутацій даних.

Приклад:

let originalDate = new Date(2023, 5, 10);
let modifiedDate = new Date(originalDate);
modifiedDate.setDate(15);
Порада:

Пам'ятайте, що методи об'єкта Date в JavaScript працюють з місцевим часовим поясом. Якщо ви працюєте з датами в різних часових поясах, розгляньте використання бібліотеки, такої як moment-timezone, для керування часовими поясами.
Порада:

Хоча "перекочування" дати може здаватися помилкою (наприклад, встановлення 32 як дня місяця для липня), це може бути корисним для додавання або віднімання днів від дати. Замість використання бібліотеки або складних обчислень, просто використовуйте Date.prototype.setDate().

Приклад:

let date = new Date(2023, 6, 31);
date.setDate(date.getDate() + 3);
console.log(date); // 3 серпня 2023 року

Синтаксис

setDate(dateValue)

Параметри

*dateValue

Це ціле число, яке представляє день місяця для вказаної дати від 1 до 31. Якщо число виходить за рамки цього діапазону, JavaScript автоматично коригує місяць та рік. Наприклад, якщо для лютого вказано число 30, то дата автоматично стане 2 березня (або 1 березня, якщо рік високосний).

Return

timestamp

Метод модифікує об'єкт Date "на місці" і повертає його новий timestamp. Якщо значення dateValue дорівнює NaN (або іншим значенням, які конвертуються у NaN, таким як undefined), дата встановлюється як "Invalid Date", і метод повертає NaN.

Переглядачі

Переглядач

1

1

1

3

12
Переглядач

4.4

18

4

1
Переглядач

0.10.0

1.0

Приклади


Цей приклад демонструє використання методу setDate() для встановлення конкретного дня місяця. Користувач може вибрати число від 1 до 31 через елемент введення (input), натиснути на кнопку, і побачити результат відображеного дня місяця у поточному місяці та році.

У цьому прикладі ми спочатку створюємо дату 15 лютого 2023 року. Щоб визначити останній день лютого, ми спочатку встановлюємо дату на перший день наступного місяця з допомогою setMonth(). Потім, використовуючи метод setDate(), ми встановлюємо дату на 0, що автоматично "зсовує" її назад на останній день попереднього місяця - у нашому випадку це 28 лютого 2023 року.

// Створюємо дату для 15 лютого 2023 року
let date = new Date(2023, 1, 15);

// Встановлюємо дату на перший день наступного місяця
date.setMonth(date.getMonth() + 1);
date.setDate(0);

console.log(date); // Виводимо: "Thu Feb 28 2023 00:00:00 GMT+0200 (Eastern European Standard Time)"

Тут ми створюємо дату 25 грудня 2023 року. Щоб додати 7 днів до цієї дати, ми використовуємо комбінацію методів getDate() і setDate(). Спершу ми отримуємо поточний день місяця з getDate(), додаємо до нього 7 і встановлюємо нову дату за допомогою setDate(). Цей підхід автоматично враховує переходи між місяцями і роками, тому результатом є 1 січня 2024 року.

// Створюємо дату для 25 грудня 2023 року
let christmas = new Date(2023, 11, 25);

// Додаємо до дати 7 днів
christmas.setDate(christmas.getDate() + 7);

console.log(christmas); // Виводимо: "Mon Jan 01 2024 00:00:00 GMT+0200 (Eastern European Standard Time)"

Спільнота

Зв'язок