JavaScript 에서 ISO 형식 날짜 검증하기 - 튜토리얼

소개

이 랩에서는 주어진 문자열이 단순 확장 ISO 형식 (ISO 8601) 으로 유효한 날짜 문자열인지 확인하는 방법을 살펴봅니다. Date 생성자와 관련 메서드를 사용하여 문자열로부터 Date 객체를 생성하고 유효성을 검사합니다. 이 랩을 마치면 JavaScript 에서 날짜를 처리하고 ISO 형식을 사용하여 날짜를 검증하는 방법에 대한 이해도가 높아질 것입니다.

ISO 날짜 형식 및 JavaScript Date 객체 이해

코딩을 시작하기 전에 ISO 8601 날짜 형식이 무엇인지, 그리고 JavaScript 가 날짜를 어떻게 처리하는지 이해해 보겠습니다.

ISO 8601 날짜 형식

ISO 8601 형식은 날짜와 시간을 나타내기 위한 국제 표준입니다. 단순 확장 ISO 형식은 다음과 같습니다.

YYYY-MM-DDTHH:mm:ss.sssZ

여기서:

YYYY는 연도 (4 자리) 를 나타냅니다.
MM은 월 (2 자리) 을 나타냅니다.
DD는 일 (2 자리) 을 나타냅니다.
T는 날짜와 시간을 구분하는 문자입니다.
HH는 시 (2 자리) 를 나타냅니다.
mm은 분 (2 자리) 을 나타냅니다.
ss는 초 (2 자리) 를 나타냅니다.
sss는 밀리초 (3 자리) 를 나타냅니다.
Z는 UTC 시간대 (Zulu time) 를 나타냅니다.

예를 들어, 2023-05-12T14:30:15.123Z는 2023 년 5 월 12 일 오후 2 시 30 분 15.123 초 UTC 를 나타냅니다.

JavaScript Date 객체

JavaScript 는 날짜와 시간을 처리하기 위한 내장 Date 객체를 제공합니다. 새로운 Date 객체를 생성할 때 ISO 형식 문자열을 전달할 수 있습니다.

const date = new Date("2023-05-12T14:30:15.123Z");

터미널을 열고 Date 객체로 작업하는 연습을 해보겠습니다.

WebIDE 상단의 터미널 메뉴를 클릭하여 터미널을 엽니다.
node를 입력하고 Enter 키를 눌러 Node.js 대화형 셸을 시작합니다.
현재 시간에 대한 새로운 Date 객체를 생성합니다.

const now = new Date();
console.log(now);

node-prompt

이 Date 객체를 ISO 문자열로 변환합니다.

const isoString = now.toISOString();
console.log(isoString);

다음과 유사한 출력을 볼 수 있습니다.

2023-05-12T14:30:15.123Z

ISO 문자열에서 Date 를 생성합니다.

const dateFromIso = new Date("2023-05-12T14:30:15.123Z");
console.log(dateFromIso);

node-prompt

이것은 JavaScript 가 ISO 형식 문자열에서 Date 객체를 파싱하고 생성할 수 있는 방법을 보여줍니다.

ISO 형식 날짜 문자열을 검증하는 함수 생성

이 단계에서는 주어진 문자열이 유효한 ISO 8601 형식인지 확인하는 JavaScript 함수를 생성합니다.

검증 함수 생성

ISO 날짜 검증기를 위한 새로운 JavaScript 파일을 생성해 보겠습니다.

WebIDE 에서 왼쪽 사이드바의 탐색기 아이콘을 클릭합니다.
파일 탐색기에서 마우스 오른쪽 버튼을 클릭하고 "새 파일"을 선택합니다.
파일 이름을 isISODate.js로 지정하고 Enter 키를 누릅니다.
파일에 다음 코드를 추가합니다.

/**
 * 문자열이 유효한 ISO 8601 형식의 날짜 문자열인지 확인합니다.
 * @param {string} val - 확인할 문자열
 * @return {boolean} - 문자열이 ISO 형식인 경우 true 를 반환하고, 그렇지 않으면 false 를 반환합니다.
 */
const isISOString = (val) => {
  // 입력 문자열에서 Date 객체를 생성합니다.
  const d = new Date(val);

  // 날짜가 유효한지 (NaN 이 아닌지) 와 ISO 문자열이 원본과 일치하는지 확인합니다.
  return !Number.isNaN(d.valueOf()) && d.toISOString() === val;
};

// 다른 곳에서 사용할 수 있도록 함수를 내보냅니다.
module.exports = isISOString;

이 함수가 어떻게 작동하는지 살펴보겠습니다.

new Date(val)은 입력 문자열에서 Date 객체를 생성합니다.
d.valueOf()는 숫자 타임스탬프 값 (1970 년 1 월 1 일 이후의 밀리초) 을 반환합니다.
Number.isNaN(d.valueOf())는 날짜가 유효하지 않은지 (NaN 은 "Not a Number"를 의미) 확인합니다.
d.toISOString() === val은 Date 를 다시 ISO 문자열로 변환한 것이 원래 입력과 일치하는지 확인합니다.

함수 테스트

이제 함수를 테스트하기 위해 간단한 테스트 파일을 생성해 보겠습니다.

testISO.js라는 다른 파일을 생성합니다.
다음 코드를 추가합니다.

// isISOString 함수를 가져옵니다.
const isISOString = require("./isISODate");

// 유효한 ISO 형식 날짜로 테스트합니다.
console.log("유효한 ISO 날짜 테스트:");
console.log("2020-10-12T10:10:10.000Z");
console.log("결과:", isISOString("2020-10-12T10:10:10.000Z"));
console.log();

// 유효하지 않은 형식으로 테스트합니다.
console.log("ISO 가 아닌 날짜 테스트:");
console.log("2020-10-12");
console.log("결과:", isISOString("2020-10-12"));

Node.js 를 사용하여 테스트 파일을 실행합니다.

node testISO.js

다음과 유사한 출력을 볼 수 있습니다.

유효한 ISO 날짜 테스트:
2020-10-12T10:10:10.000Z
결과: true

ISO가 아닌 날짜 테스트:
2020-10-12
결과: false

이것은 우리 함수가 "2020-10-12T10:10:10.000Z"가 유효한 ISO 형식 날짜이고 "2020-10-12"는 그렇지 않다는 것을 올바르게 식별하는 것을 보여줍니다.

다양한 날짜 형식으로 테스트

이제 기본적인 검증 함수가 있으므로, 다양한 입력에 대한 동작 방식을 이해하기 위해 다른 날짜 형식으로 테스트해 보겠습니다.

테스트 스위트 생성

다양한 날짜 형식을 검사하기 위해 포괄적인 테스트 스위트를 생성해 보겠습니다.

dateTester.js라는 새 파일을 생성합니다.
다음 코드를 추가합니다.

// isISOString 함수를 가져옵니다.
const isISOString = require("./isISODate");

// 다른 날짜 문자열을 테스트하는 함수
function testDate(description, dateString) {
  console.log(`테스트: ${description}`);
  console.log(`입력: "${dateString}"`);
  console.log(`ISO 형식 여부: ${isISOString(dateString)}`);
  console.log("-----------------------");
}

// 유효한 ISO 날짜 예시
testDate("표준 ISO 날짜 (시간대 Z)", "2023-05-12T14:30:15.123Z");
testDate("밀리초가 0 인 ISO 날짜", "2020-10-12T10:10:10.000Z");

// 유효하지 않거나 ISO 형식이 아닌 예시
testDate("날짜만 (시간 구성 요소 없음)", "2023-05-12");
testDate("밀리초가 없는 날짜 및 시간", "2023-05-12T14:30:15Z");
testDate("Z 대신 시간대 오프셋이 있는 날짜", "2023-05-12T14:30:15+01:00");
testDate(
  "유효하지 않은 날짜 (13 월은 존재하지 않음)",
  "2023-13-12T14:30:15.123Z"
);
testDate("날짜가 아닌 문자열", "Hello World");

터미널에서 테스트 스위트를 실행합니다.

node dateTester.js

어떤 문자열이 유효한 ISO 날짜이고 그렇지 않은지 보여주는 출력을 볼 수 있습니다.

결과 이해

각 테스트 케이스가 유효하거나 유효하지 않은 이유를 분석해 보겠습니다.

2023-05-12T14:30:15.123Z - UTC 시간대 표시자 (Z) 와 함께 완전한 ISO 8601 형식을 따르므로 유효합니다.
2020-10-12T10:10:10.000Z - 밀리초가 명시적으로 000 으로 설정되어 있으므로 이것도 유효합니다.
2023-05-12 - 유효한 날짜이지만 시간 구성 요소가 없으므로 ISO 형식이 아닙니다.
2023-05-12T14:30:15Z - ISO 형식으로 보이지만 엄격한 ISO 형식에 필요한 밀리초가 없습니다.
2023-05-12T14:30:15+01:00 - 'Z' 대신 시간대 오프셋 (+01:00) 을 사용합니다. ISO 8601 에 따르면 유효하지만, 우리 함수는 toISOString()에서 생성된 정확한 형식을 요구하며, 이는 항상 'Z'를 사용합니다.
2023-13-12T14:30:15.123Z - 유효하지 않은 날짜 (13 월은 존재하지 않음) 이므로 new Date()는 유효하지 않은 Date 객체를 생성합니다.
Hello World - 이것은 전혀 날짜가 아니므로 new Date()는 유효하지 않은 Date 객체를 생성합니다.

우리 검증 함수는 구체적으로 두 가지 조건을 확인합니다.

문자열이 유효한 날짜로 파싱되어야 합니다 (NaN 이 아님).
해당 날짜가 ISO 문자열로 다시 변환될 때 원래 입력과 정확히 일치해야 합니다.

이 접근 방식은 JavaScript 의 toISOString() 메서드에서 생성된 정확한 ISO 형식을 검증하도록 보장합니다.

엣지 케이스 처리 및 함수 개선

이 마지막 단계에서는 엣지 케이스를 처리하고 더 강력하게 만들기 위해 isISOString 함수를 개선합니다.

일반적인 엣지 케이스

실제 애플리케이션에서 데이터를 검증할 때는 다양한 예기치 않은 입력을 처리해야 합니다. 몇 가지 엣지 케이스를 살펴보겠습니다.

빈 문자열
문자열이 아닌 값 (null, undefined, 숫자, 객체)
다른 시간대 표현

함수 개선

이러한 엣지 케이스를 처리하도록 isISODate.js 파일을 업데이트해 보겠습니다.

WebIDE 에서 isISODate.js 파일을 엽니다.
기존 코드를 이 개선된 버전으로 바꿉니다.

/**
 * 문자열이 유효한 ISO 8601 형식의 날짜 문자열인지 확인합니다.
 * @param {string} val - 확인할 문자열
 * @return {boolean} - 문자열이 ISO 형식인 경우 true 를 반환하고, 그렇지 않으면 false 를 반환합니다.
 */
const isISOString = (val) => {
  // 입력이 문자열인지 확인합니다.
  if (typeof val !== "string") {
    return false;
  }

  // 문자열이 비어 있는지 확인합니다.
  if (val.trim() === "") {
    return false;
  }

  try {
    // 입력 문자열에서 Date 객체를 생성합니다.
    const d = new Date(val);

    // 날짜가 유효한지, ISO 문자열이 원본과 일치하는지 확인합니다.
    return !Number.isNaN(d.valueOf()) && d.toISOString() === val;
  } catch (error) {
    // 검증 중에 오류가 발생하면 false 를 반환합니다.
    return false;
  }
};

// 함수 내보내기
module.exports = isISOString;

이 개선된 함수는 이제 다음을 수행합니다.

처리하기 전에 입력이 문자열인지 확인합니다.
빈 문자열을 처리합니다.
발생할 수 있는 모든 오류를 처리하기 위해 try-catch 블록을 사용합니다.
여전히 핵심 검증 로직을 수행합니다.

개선된 함수 테스트

엣지 케이스로 개선된 함수를 확인하기 위해 마지막 테스트 파일을 생성해 보겠습니다.

edgeCaseTester.js라는 새 파일을 생성합니다.
다음 코드를 추가합니다.

// 개선된 isISOString 함수를 가져옵니다.
const isISOString = require("./isISODate");

// 테스트하고 결과를 표시하는 함수
function testCase(description, value) {
  console.log(`테스트: ${description}`);
  console.log(`입력: ${value === "" ? "(빈 문자열)" : value}`);
  console.log(`유형: ${typeof value}`);
  console.log(`ISO 형식 여부: ${isISOString(value)}`);
  console.log("-----------------------");
}

// 다양한 엣지 케이스로 테스트합니다.
testCase("유효한 ISO 날짜", "2023-05-12T14:30:15.123Z");
testCase("빈 문자열", "");
testCase("Null 값", null);
testDate("Undefined 값", undefined);
testCase("숫자 값", 12345);
testCase("객체 값", {});
testCase("ISO 문자열로 현재 날짜", new Date().toISOString());

테스트 파일을 실행합니다.

node edgeCaseTester.js

실제 애플리케이션

실제 애플리케이션에서 isISOString 함수는 다음과 같은 시나리오에서 사용될 수 있습니다.

날짜 필드에서 사용자 입력 검증
외부 API 에서 수신된 날짜 확인
데이터베이스에서 일관된 날짜 형식 보장
처리 전 데이터 검증

예를 들어, 양식 검증 함수에서 다음과 같이 사용할 수 있습니다.

function validateForm(formData) {
  // 기타 검증...

  if (formData.startDate && !isISOString(formData.startDate)) {
    return {
      valid: false,
      error: "시작 날짜는 ISO 형식이어야 합니다."
    };
  }

  // 추가 검증...

  return { valid: true };
}

개선된 함수는 이제 예기치 않은 입력을 처리하고 ISO 형식 날짜 문자열에 대한 안정적인 검증을 제공할 수 있을 만큼 강력합니다.

요약

이 랩에서는 문자열이 단순 확장 ISO 형식 (ISO 8601) 인지 검증하는 방법을 배웠습니다. 다음은 여러분이 달성한 내용입니다.

ISO 8601 날짜 형식과 구조에 대해 배웠습니다.
JavaScript Date 객체가 ISO 형식 문자열과 어떻게 작동하는지 이해했습니다.
문자열이 정확한 ISO 형식인지 검증하는 함수를 만들었습니다.
다양한 날짜 형식으로 함수를 테스트했습니다.
엣지 케이스를 처리하고 더 강력하게 만들기 위해 함수를 개선했습니다.

이 기술은 API, 데이터베이스 또는 일관된 날짜 형식이 중요한 모든 시스템에서 작업할 때 특히 유용합니다. ISO 8601 형식은 모호성을 피하고 날짜와 시간을 표현하는 표준화된 방법을 제공하기 때문에 널리 사용됩니다.

이 랩의 주요 내용:

ISO 8601 형식은 특정 패턴을 따릅니다: YYYY-MM-DDTHH:mm:ss.sssZ
JavaScript 의 Date.prototype.toISOString() 메서드는 항상 이 형식으로 날짜를 출력합니다.
날짜를 검증하려면 유효성과 형식을 모두 확인해야 합니다.
적절한 오류 처리는 검증 함수를 더욱 강력하게 만듭니다.

이제 이 지식을 적용하여 날짜 및 시간 데이터를 올바르게 처리하는 더 안정적인 애플리케이션을 구축할 수 있습니다.

문자열이 ISO 형식의 날짜인지 확인

소개