Как преобразовать строку в объект Date в JavaScript

Чтобы преобразовать строку в объект Date в JavaScript, можно использовать конструктор Date с аргументом‑строкой, но имейте в виду, что поведение парсинга значительно различается в разных браузерах. Для надёжного преобразования используйте строки формата ISO 8601 (YYYY‑MM‑DDTHH:mm:ss.sssZ), которые одинаково поддерживаются современными браузерами, либо вручную разберите компоненты строки и передайте числовые аргументы в конструктор Date для максимальной совместимости.

Contents

• Использование конструктора Date со строками
• Метод Date.parse()
• Вручную разбирать строку для максимальной совместимости
• Обработка различных форматов даты
• Рекомендованные библиотеки для надёжного парсинга дат
• Лучшие практики кроссбраузерной совместимости

Использование конструктора Date со строками

Самый простой способ преобразовать строку в объект Date – передать строку напрямую в конструктор Date:

var st = "2023-12-25T10:30:00Z";
var dt = new Date(st);

Однако этот подход имеет значительные ограничения из‑за различий в браузерах. Согласно Mozilla Developer Network, парсинг строк с помощью конструктора Date настоятельно не рекомендуется из‑за различий и несоответствий в браузерах.

Надёжность сильно зависит от формата строки:

Формат ISO 8601 (самый надёжный)

// Стандартный формат ISO с указанием UTC
var date1 = new Date("2023-12-25T10:30:00Z");
console.log(date1); // Корректный объект Date

// Формат ISO с смещением часового пояса
var date2 = new Date("2023-12-25T10:30:00+02:00");
console.log(date2); // Корректно распарсено с учётом смещения

Как отмечено в документации MDN, интерпретация как UTC‑времени обусловлена исторической ошибкой спецификации, которую нельзя было изменить из‑за совместимости веб‑страниц.

Метод Date.parse()

Метод Date.parse() преобразует строку даты в миллисекунды с 1 января 1970 г., которые затем можно использовать для создания объекта Date:

var timestamp = Date.parse("2023-12-25T10:30:00Z");
var dt = new Date(timestamp);

Важное ограничение: Date.parse() ведёт себя идентично конструктору Date при парсинге строк и страдает от тех же проблем совместимости с браузерами. Согласно MDN, реализации обычно по умолчанию используют локальный часовой пояс, если строка нестандартная, что приводит к непоследовательным результатам.

Вручную разбирать строку для максимальной совместимости

Для гарантированной кроссбраузерной совместимости, особенно с устаревшими браузерами, такими как Internet Explorer до версии 9, следует вручную разбирать строку и создавать объект Date с числовыми компонентами:

function parseDateString(dateString) {
    // Пример для формата "YYYY-MM-DD"
    var parts = dateString.split(/[-\/]/);
    return new Date(parts[0], parts[1] - 1, parts[2]);
}

// Использование
var date = parseDateString("2023-12-25");
console.log(date);

Ключевые преимущества ручного парсинга:

• Независимость от несовместимостей браузеров, поскольку вы явно указываете конструктору Date, какие числа соответствуют году, месяцу и дню.
• Работает во всех браузерах, включая очень старые.
• Полный контроль над логикой парсинга.

Как отмечено в Tutorial Reference, этот метод защищён от несовместимостей браузеров, поскольку вы явно сообщаете конструктору Date, какие числа соответствуют году, месяцу и дню.

Обработка различных форматов даты

Разные форматы дат требуют разных подходов к парсингу:

Формат “MM/DD/YYYY”

function parseMMDDYYYY(dateString) {
    var parts = dateString.split('/');
    return new Date(parts[2], parts[0] - 1, parts[1]);
}

var date = parseMMDDYYYY("12/25/2023");

Формат “DD-MM-YYYY”

function parseDDMMYYYY(dateString) {
    var parts = dateString.split('-');
    return new Date(parts[2], parts[1] - 1, parts[0]);
}

var date = parseDDMMYYYY("25-12-2023");

Формат “DD/MMM/YYYY” (например, “25-Dec-2023”)

function parseDDMMMYYYY(dateString) {
    var parts = dateString.split('-');
    var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                  'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
    var monthIndex = months.indexOf(parts[1]);
    return new Date(parts[2], monthIndex, parts[0]);
}

var date = parseDDMMMYYYY("25-Dec-2023");

Рекомендованные библиотеки для надёжного парсинга дат

Для приложений, требующих надёжного парсинга дат из разных форматов и в разных браузерах, рассмотрите специализированные библиотеки:

Day.js

import dayjs from 'dayjs';

// Автоматически обрабатывает различные форматы дат
var date = dayjs("12/25/2023").toDate();

Согласно документации Day.js, вы можете передать ключ локали в качестве третьего параметра для парсинга строк с учётом локали.

Moment.js

import moment from 'moment';

// Идеально подходит для сложных операций с датами
var date = moment("25-12-2023", "DD-MM-YYYY").toDate();

Как отмечено в документации Moment.js, другие типы строк могут работать, но их парсинг специфичен для реализации и может значительно различаться, особенно в старых браузерах.

Luxon

import { DateTime } from 'luxon';

// Лучшая поддержка часовых поясов и локалей
var date = DateTime.fromFormat("25-Dec-2023", "dd-LLL-yyyy").toJSDate();

Лучшие практики кроссбраузерной совместимости

1. Используйте формат ISO 8601, когда это возможно

// Всегда предпочтительнее этот формат
var date = new Date("2023-12-25T10:30:00Z");

Как отмечает MDN, современные браузеры реализуют спецификацию ECMA‑402, которая предоставляет объект Intl и определяет поведение функций даты/времени объекта Date.

2. Проводите тесты на целевых браузерах

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

3. Обрабатывайте часовые пояса явно

// Используйте методы UTC для консистентности
var date = new Date(Date.UTC(2023, 11, 25, 10, 30, 0));

4. Используйте библиотеки для сложных приложений

Для приложений, обрабатывающих множество разных форматов дат или требующих надёжных операций с датами, библиотеки вроде Luxon обеспечивают лучшую поддержку часовых поясов и локалей, как отмечено в Intellipaat.

Источники

1. Date.parse() – JavaScript | MDN
2. Date – JavaScript | MDN
3. Parsing a string to a date in JavaScript – Stack Overflow
4. Convert string to datetime – Stack Overflow
5. How to Convert a String to a Date Object in JavaScript | Tutorial Reference
6. JavaScript Date toISOString() Method – W3Schools
7. JavaScript Date ISO8601 – Stack Overflow
8. JavaScript Date from ISO String: A Comprehensive Guide
9. Moment.js – Docs
10. Convert string to date in JavaScript – Intellipaat

Заключение

• Для максимальной совместимости всегда используйте ручной парсинг, разбивая строки дат и передавая числовые аргументы в конструктор Date.
• Формат ISO 8601 (YYYY‑MM‑DDTHH:mm:ss.sssZ) является самым надёжным строковым форматом для современных браузеров.
• Избегайте полагаться на конструктор Date или Date.parse() для парсинга произвольных строк из‑за несовместимостей браузеров.
• Используйте специализированные библиотеки как Day.js, Moment.js или Luxon для сложных операций с датами и лучшего управления часовыми поясами.
• Тщательно тестируйте на целевых браузерах, особенно если поддерживаете старые версии, такие как Internet Explorer.

Для конкретного примера кода, который вы предоставили, рекомендуемый подход будет следующим:

var st = "date in some format";
var dt = new Date();

// Для ISO‑формата:
var dt_st = new Date(st);

// Для ручного парсинга (более надёжно):
var parts = st.split(/[-\/]/); // Подберите разделитель под ваш формат
var dt_st = new Date(parts[0], parts[1] - 1, parts[2]);