ресурс для начинающих веб-разработчиков
комплексные веб-услуги по созданию сайтов

Справочный материал по основным языкам программирования и верстки сайтов.

Готовая методика создания простых и сложных динамичных сайтов, с использованием PHP и MySQL.

Использование веб-редактора Adobe Dreamweaver в разработке сайтов.

Использование графических редакторов Adobe Flash, Adobe Photoshop, Adobe Fireworks в подготовке веб-графики.

Разработка веб-сайтов под "ключ".

Разработка отдельных фрагментов сайтов, консультации по вопросам верстки веб-страниц и веб-программирования.

Объект Date. Cвойства и методы объекта. Строковые даты

Объект Date

Для создания объекта Date используется выражение:

имяОбъекта Даты = new Date([параметры])

Параметры не обязательны, на что указывают квадратные скобки. Обратите внимание, что имяОбъектаДаты является объектом даты, а не значением какого-нибудь другого типа (например, строкой или числом).

Для манипуляций с объектом даты применяется множество методов объекта Date. При этом используется такой синтаксис:

переменная = имяОбъектаДаты.метод()

Рассмотрим примеры. Если мы напишем выражение без конкретных параметров, то в объекте Date будут сохранены показания системных часов нашего компьютера.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Объект Date</title>
<script language="JavaScript">
adate=new Date
document.write(adate)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Если объекту даты нужно присвоить новое значение (например добавить один год), то для этого используется соответствующий метод.

имяОбъектаДаты.метод(новое Значение)

Рассмотрим пример. Добавим к текущей дате 1 год.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Объект Date</title>
<script language="JavaScript">
adate=new Date() /*создание объекта, содержащего текущую дату и время*/

nYear=adate.getYear() /*в переменной nYear содержится значение текущего года*/

nYear=nYear+1 /*впеременной nYear содержится значение, большее, чем текущий год на 1*/

a=adate.setYear(nYear) /*в объекте установлено новое значение года*/

document.write(adate)

</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Для создания нового объекта даты можно воспользоваться одним из пяти способов присвоения ему даты и времени. Речь идет об аргументах функции конструктора new Date().

new Date("Месяц дд, гггг чч:мм:сс")
new Date("Месяц дд, гггг")
new Date(гг, мм, дд, чч, мм, сс)
new Date(гг, мм, дд)
new Date(миллисекунды)

Четыре первых способа можно разбить на две группы – с длинными строками и списком значений, разделенных запятой (причем параметры времени не являются обязательными). Если они опущены, метод устанавливает их значения равными 0 (полночь). Аргументы даты опустить нельзя – каждый объект даты при создании требует их указания.

В строковых версиях необходимо указывать полное английское название месяца. Аббревиатуры не поддерживаются. Далее следует число, год, часы, минуты и секунды(именно в такой последовательности) Для значений, меньших 10, используется одно- или двухсимвольная версия(например 3:06:00). Часы, минуты и секунды разделяются двоеточием.

В коротких версиях параметров методов указывается список целочисленных аргументов в приведенном выше порядке.

Аргументом последней версии параметров метода является значение даты и времени, выраженное в миллисекундах. Такой формат используется в арифметических расчетах дат. Для его преобразования в объект даты применяется конструктор new Date(). Впоследствии объект даты позволяет получить более удобные значения.

Свойства и методы объекта Date

Как и объекты String и Array, объект Date поддерживает небольшой набор свойств и методов, характерных для всех объектов. Одмим из них является свойство prototype, позволяющее добавить к объекту новые свойства и методы.

Кроме того, каждый объект даты имеет свойство constructor, указывающее на функцию, с помощью которой был создан объект.

Объект даты имеет несколько методов для преобразования значений своих компонентов в строки. Метод valueOf() возвращает значение в миллисекундах, которое совпадает с результатом метода getUTCMilliseconds().

Методы объекта Date

Для чтения и изменения информации о дате и времени, хранящейся в объекте даты, служат методы объекта Date. Напомним, что объект даты создается с помощью выражения:

имяОбъектаДаты = new Date([параметры])

Затем, чтобы применить метод метод() к объекту даты имяОбъектаДаты, следует написать:

имяОбъектаДаты.метод([параметры])

Довольно большое множество всех методов можно разделить на две категории: методы получения значений (их названия имеют префикс get) и методы установки новых значений (их названия имеют префикс set). В каждой категории выделяются две группы методов — для локального формата и формата UТС. Методы позволяют работать с отдельными компонентами даты и времени (годом, месяцем, числом, днем недели, часами, минутами, секундами и миллисекундами).

Таблица. Методы объекта Date
Метод Диапазон значений Описание
getFullYear() 1970 и далее Год
getYear() 70 и далее Год
getMonth() 0 – 11 Месяц (январь соответствует 0)
getDate() 1– 31 Число
getDay() 0 – 6 День недели (воскресенье соответствует 0)
getHours() 0 – 23 Часы в 24-часовом формате
getMinutes() 0 – 59 Минуты
getSeconds() 0 – 59 Секунды
getTime() 0 и далее Миллисекунды с
1.1.70 00:00:00 GMT
getMilliseconds() 0 и далее Миллисекунды с 1.1.70 00:00:00 GMT
getUTCFullYear() 1970 и далее Год UTC
getUTCMonth() 0 – 11 Месяц UTC(январь соответствует 0)
getUTCDate() 1 – 31 Число UTC
getUTCDay() 0 – 6 День недели UTC(воскресенье соответствует 0)
getUTCHours() 0 – 23 Часы UTC в 24-часовом формате
getUTCMinutes() 0 – 59 Минуты UTC
getUTCSeconds() 0 – 59 Секунды UTC
getUTCMilliseconds() 0 и далее Миллисекунды UTC с
1.1.70 00:00:00 GMT
setYear(знач) 1970 и далее Установка года(четырехзначного)
setFullYear(знач) 1970 и далее Установка года
setMonth(знач) 0 – 11 Установка месяца(янвать соответствует 0)
setDate(знач) 1 – 31 Установка числа
setDay(знач) 0 – 6 Установка дня недели
(воскресенье соответствует 0)
setHours(знач) 0 – 23 Установка часов в 24-часовом формате
setMinutes(знач) 0 – 59 Установка минут
setSeconds(знач) 0 – 59 Установка секунд
setMilliseconds(знач) 0 и далее Установка миллисекунд
с 1.1.70 00:00:00 GMT
setTime(знач) 0 и далее Установка миллисекунд
с 1.1.70 00:00:00 GMT
setUTCFullYear(знач) 1970 и далее Установка года UTC
setUTCMonth(знач) 0 – 11 Установка месяца UTC(янвать соответствует 0)
setUTCDate(знач) 1 – 31 Установкачисла UTC
setUTCDay(знач) 0 – 6 Установка дня недели UTC
(воскресенье соответствует 0)
setUTCHours(знач) 0 – 23 Установка часов UTC в
24-часовом формате
setUTCMinutes(знач) 0 – 59 Установка минут UTC
setUTCSeconds(знач) 0 – 59 Установка секунд UTC
setUTCMilliseconds(знач) 0 и далее Установка миллисекунд UTC
с 1.1.70 00:00:00 GMT
getTimezoneOffset() 0 и далее Разница в минутах по отношению
к GMT/UTC
toDateString()   Строка с датой (без времени)
в формате браузера (IE5.5)
toGMTString()   Строка с датой и временем в
глобальном формате
toLocaleDateString()   Строка с датой без времени в локализованном формате системы
(NN6, IE5.5)
toLocaleString()   Строка с датой и временем в локализованном формате
системы
toLocaleTimeString()   Строка со временем без даты и в локализованном формате системы
(NN6, IE5.5)
toString()   Строка с датой и временем в формате браузера
toTimeString()   Строка со временем без даты в формате браузера(IE5.5)
toUTCString()   Строка с датой и временем в глобальном формате
Date.parse("дата")   Преобразование строки с датой в число миллисекунд
Date.UTC(знач)   Преобразование строки с датой GMT в число

Вычислять разность двух дат или создавать счетчик времени, оставшегося до некоторого заданного срока, можно с помощью методов как для локального формата, так и для UTC. Не следует применять выражения, использующие различные форматы времени, поскольку результаты могут оказаться неправильными. Формат UTC обычно применяется в расчетах, учитывающих часовой пояс.

Следует также учитывать, что нумерация месяцев, дней недели, часов, минут и секунд начинается с 0. Для компонентов времени это естественно. Однако при такой нумерации декабрь оказывается 11-м месяцем в году, а не 12-м, как это принято повсеместно. Воскресенье (Sunday) является 0-м днем недели, а не 7-м.

Значение года XX века представляется в двузначном формате как разность между этим годом и 1900. Например, 1998 год представляется как 98. Годы до 1900 и после 1999 обозначаются в четырехзначном формате. Например, 2008 год нужно так и писать — 2008, поскольку 08 — это 1908 год. Метод getFullYear()возвращает четырехзначное значение года.

Рассмотрим пример.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Методы объекта Date</title>
<script language="JavaScript">
adate=new Date() //текущие дата и время
Year=adate.getYear() //2008

document.write(adate+"<br>"+Year+"<br>")
adate=new Date(98,9,29) /*объект даты содержит информацию о дате 29 октября 1998 года, 00:00:00*/
Year=adate.getYear() //98
x=adate.getFullYear() //1998

document.write(adate+"<br>"+Year+"<br>"+x)
alert(adate+" ,"+Year+" ,"+x)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Изменение любого компонента даты производится с помощью соответствующего метода, название которого начинается с приставки set. При этом значения других компонентов перечисляются автоматически.

Рассмотрим, как изменятся связанные значения в следующей последовательности.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Методы объекта Date</title>
<script language="JavaScript">

adate=new Date(98,9,29) /*объект даты содержит информацию о дате 29 октября 1998 года, 00:00:00*/
a=adate.getDay() //результат 4, четверг
alert(adate+" ,"+a)

Year=adate.setYear(2003) //переходим к 2003 году
a=adate.getDay() //результат 3, среда

document.write(adate+"/"+a)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

Строковые даты

После создания объекта даты, при попытке ее отображения на странице, автоматически применяется метод toString(). Формат строки зависит от браузера и операционной системы. Например, в IE7 для Windows XP строка имеет следующий формат:

Fri Oct 31 16:52:34 UTC+0300 2008
Для Opera 9.24 эта строка принимает такой вид:
Fri, 31 Oct 2008 16:53:38 GMT+0300
Для Mozilla Firefox такой:
Fri Oct 31 2008 16:54:36 GMT+0300

Если коррекцию времени с учетом часового пояса производить не требуется, то для строкового представления даты и времени можно воспользоваться методом toLocaleString():

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Объект Date</title>
<script language="JavaScript">
adate=new Date
a=adate.toLocaleString()
document.write(a)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

В браузерах и работают еще два метода представления отдельно даты и времени в виде строки:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Объект Date</title>
<script language="JavaScript">
adate=new Date
a=adate.toLocaleDateString() //31 октября 2008 г.
b=adate.toLocaleTimeString() //17:18:09
document.write(a+ "<br>"+b)

</script>
</head>

<body>
</body>
</html>

Заметим, что формат представления даты и времени, обеспечиваемый методами toLocalDateString() и toLocaLTimeString(), зависит от настроек операционной системы и браузера. Если вы будете использовать эти методы для вывода даты и времени на веб-страницу, то они будут выглядеть так, как пользователь привык их видеть на своем компьютере.

С датой иногда приходится выполнять различные вычисления, такие как определение даты через заданное количество дней от текущей или количество дней между двумя датами. Вот здесь как раз и требуется предварительный подсчет миллисекунд, содержащихся в минуте, часе, сутках и т. д.

Рассмотрим пример.

Определим относительно текущей , дату которая наступит через неделю.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Методы объекта Date</title>
<script language="JavaScript">
w=1000*60*60*24*7 //кол-во миллисекунд в неделе - 604800000
adate=new Date() //объект Date с текущей датой
ams=adate.getTime() /*текущая дата, представленная кол-вом миллесекунд от 1.01.1970 00:00:00*/
ams+=w //ams=ams+w
adate.setTime(ams) //установка новой даты в объекте adate
sdate=adate.toLocaleString() //новая дата в виде строки
document.write(sdate)
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

А теперь определим количество дней между двумя датами 2ноября 2008 года и 31 декабря 2008 года.

Создадим два соответствующих объекта даты:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Методы объекта Date</title>
<script language="JavaScript">

adate=new Date(2008,10,2) //объект Date с датой 2 ноября 2008 года
bdate=new Date(2009,00,01) //объект Date с датой 1 января 2009 года
Date.parse(adate) /*используем метод Date.parse("дата") для перевода в миллисекунды объекта adate */
Date.parse(bdate) /*используем метод Date.parse("дата") для перевода в миллисекунды объекта bdate */
c=1000*60*60*24 //кол-во миллисекунд в сутках
sdays=(Date.parse(bdate) - Date.parse(adate) )/ c //кол-во дней 59

document.write("До нового года осталось "+sdays+" дней")
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.

А теперь усложним задачу и создадим функцию, с помощью которой определим количество дней оставшихся до католического Рождества (25 декабря 2008 года). Особенность заключается в том, что невозможно задать дату фиксированного года, т.к. программа запущенная 26 декабря 2008 года, будет считать ближайшим рождественским днем Рождество 2009 года.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Методы объекта Date</title>
<script language="JavaScript">
function myDay (){
adate=new Date(); //объект Date с текущей датой
bdate=new Date(); //объект Date с датой 25 декабря
bdate.setMonth(11); //установка месяца
bdate.setDate(25); //установка числа

if (adate.getMonth()==11 && adate.getDate()>25){
bdate.setFullYear(bdate.getFullYear()+1);
}


c=1000*60*60*24 //кол-во миллисекунд в сутках
sdays=(adate.getTime()-bdate.getTime())/c; //кол-во дней
return sdays
}

document.write("До Рождества осталось "+myDay()+" дней")
</script>
</head>

<body>
</body>
</html>

В окне веб-браузера это будет выглядеть ТАК.