Date.setSeconds() в JavaScript — встановити секунди

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

Date.prototype.setSeconds() є методом об'єкта Date в JavaScript, що дозволяє встановлювати секунди для дати. Його головна задача - зміна значення секунд в існуючому об'єкті дати.

Припустимо, у вас є інтерфейс таймера на веб-сайті, і ви хочете дати користувачам можливість встановлювати конкретну кількість секунд. У такому випадку:

let currentTimer = new Date();
currentTimer.setSeconds(45);
console.log(currentTimer);

У цьому прикладі ми встановлюємо кількість секунд на 45 для об'єкта currentTimer.

Однак важливо зауважити, що Date.prototype.setSeconds() може приймати ще два додаткових параметри, що є необов'язковими: секунди та мілісекунди. Це означає, що ви також можете вказати додаткову інформацію про мілісекунди:

let currentTimer = new Date();
currentTimer.setSeconds(45, 500);
console.log(currentTimer);

Тут ми встановлюємо секунди на 45 і мілісекунди на 500.

Якщо ви вказуєте значення, яке виходить за рамки діапазону (наприклад, 65 секунд), JavaScript автоматично скоригує хвилини і секунди об'єкта Date. Наприклад, якщо встановити 65 секунд, то хвилини збільшаться на одиницю, а секунди будуть встановлені в 5.

правити

Порада

Перш ніж передавати значення у метод setSeconds(), завжди переконайтеся, що воно є числом і входить у потрібний вам діапазон. Передавання некоректних даних може призвести до створення дати Invalid Date, яка може спричинити проблеми у подальшій роботі.

автор: Bond правити

Порада

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

автор: Bond правити

Нотатка

Якщо ви встановлюєте значення, що виходить за рамки нормального діапазону секунд (0-59), то Date.prototype.setSeconds() автоматично скоригує інші частини дати. Це може бути корисним, але також може призвести до неочікуваних результатів. Наприклад, якщо встановити 90 секунд:

let dateExample = new Date();
dateExample.setSeconds(90);
console.log(dateExample); // Виведе час із збільшенням на хвилину.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

setSeconds(secondsValue)
setSeconds(secondsValue, msValue)

Параметри

secondsValue

Ціле число від 0 до 59, яке представляє секунди.

автор: Bond

правити

msValue

Ціле число від 0 до 999, яке представляє мілісекунди.

автор: Bond

правити

Повернення

timestamp

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

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	3	12	3

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

<header>
  <h2 class="title">Date.prototype.setSeconds()</h2>
  <p class="description">Встановлює секунди вказаної дати відповідно до місцевого часу.</p>
</header>
<main>
  <div class="result">
    <input type="number" id="seconds" min="0" max="59" placeholder="Введіть секунди (0-59)" />
    <button onclick="setSeconds()">Встановити секунди</button>
    <div id="output">Тут буде результат</div>
  </div>
</main>

body {
  font-size: 16px;
  line-height: 1.5;
  font-family: monospace;
}

header {
  background-color: #f1f1f1;
  margin-bottom: 25px;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

header h2.title {
  padding-bottom: 15px;
  border-bottom: 1px solid #999;
}

header p.description {
  font-style: italic;
  color: #222;
}

.result {
  background-color: #f8f8f8;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  -moz-box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
  box-shadow: 0px 0px 3px 0px rgba(118, 118, 118, 1);
}

#output {
  margin-top: 10px;
}

function setSeconds() {
  const secondsInput = document.getElementById('seconds');
  const outputDiv = document.getElementById('output');
  let now = new Date();
  if (secondsInput.value === "" || secondsInput.value < 0 || secondsInput.value > 59) {
    outputDiv.textContent = 'Будь ласка, введіть коректне значення секунд (0-59).';
  } else {
    now.setSeconds(secondsInput.value);
    outputDiv.textContent = 'Оновлена дата та час: ' + now.toString();
  }
}
//# sourceURL=pen.js

let countdownDate = new Date(); // Задаємо поточний час
countdownDate.setMinutes(countdownDate.getMinutes() + 1); // Додаємо 1 хвилину до поточного часу

const countdown = setInterval(() => {
    let currentDate = new Date(); // Поточний час
    
    let difference = countdownDate - currentDate; // Різниця між заданою датою та поточним часом
    
    if (difference <= 0) {
        clearInterval(countdown); // Зупиняємо таймер
        console.log("Час вийшов!");
    } else {
        let seconds = Math.floor((difference / 1000) % 60);
        currentDate.setSeconds(currentDate.getSeconds() + 1); // Додаємо 1 секунду
        console.log("Залишилося секунд: " + seconds);
    }
}, 1000);

let datesArray = [new Date(), new Date(2023, 8, 20, 14, 55), new Date(2025, 2, 15, 11, 30)];

// Встановлюємо секунди на "45" для всіх дат у масиві
datesArray = datesArray.map(date => {
    date.setSeconds(45);
    return date;
});

console.log(datesArray); // Виводимо масив дат із однаковими секундами