אובייקט `Date`

מאמר זה מסביר את אובייקט ה-Date.

נסביר את אובייקט ה-Date שלב אחר שלב, מהמנגנונים הבסיסיים ועד לפעולות הנפוצות בשימוש יומיומי, עם דוגמאות קונקרטיות.

YouTube Video

אובייקט Date

מהו אובייקט ה-Date?

אובייקט ה-Date של JavaScript הוא אובייקט סטנדרטי לטיפול בתאריכים וזמנים. ברמה פנימית, הוא מנהל את התאריך והשעה לפי מספר המילישניות שחלפו מאז הראשון בינואר 1970, 00:00:00 UTC.

ראשית, ניצור אובייקט Date שמייצג את התאריך והשעה הנוכחיים, ונבדוק את התוכן שלו.

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

• קוד זה יוצר אובייקט Date שמייצג את התאריך והשעה הנוכחיים ברגע ההרצה. פורמט התצוגה תלוי בסביבת ההרצה, למשל בדפדפן או במערכת ההפעלה.

כיצד ליצור אובייקט Date

ניתן ליצור אובייקטים מסוג Date בכמה דרכים, בהתאם לצרכים שלך. נקודה חשובה שקל לטעות בה היא שפרמטר החודש בבנאי הוא בסיס אפס, כלומר חודשים מתחילים מ-0.

1const d1 = new Date();                     // Current date and time
2const d2 = new Date("2025-01-01");         // Create from an ISO date string
3const d3 = new Date(2025, 0, 1);           // January 1, 2025 (month is zero-based)
4const d4 = new Date(2025, 0, 1, 10, 30);   // January 1, 2025, 10:30
5
6console.log(d1, d2, d3, d4);

• ב-new Date(year, month, day), הפרמטר month משמעו 0 זה ינואר ו-11 זה דצמבר. אם לא מבינים את התכונה הזו, עלולים בטעות ליצור תאריך שמוסט בחודש, לכן תמיד להיזהר.

שליפת כל רכיב מהתאריך והשעה

באמצעות אובייקט Date ניתן לשלוף בצורה נפרדת את השנה, החודש, היום, השעה ויום השבוע. כל שיטות השליפה מחזירות ערכים כמספרים.

1const date = new Date();
2
3console.log(date.getFullYear()); // Year
4console.log(date.getMonth());    // Month (0-based: 0 = January)
5console.log(date.getDate());     // Day of the month
6console.log(date.getHours());    // Hours
7console.log(date.getMinutes());  // Minutes
8console.log(date.getSeconds());  // Seconds
9console.log(date.getDay());      // Day of the week (0 = Sunday, 6 = Saturday)

• כמו ביצירה, גם כאן יש לשים לב ש-getMonth() הוא גם כן מבוסס אפס. בשימוש בתצוגה, מקובל להוסיף 1 כדי להתאים את הערך.
• getDay() מחזירה את יום השבוע כמספר. 0 מייצג את יום ראשון, ו-6 מייצג את יום שבת.

שינוי תאריכים וזמנים

אובייקט Date הוא ניתן לשינוי (mutable), כלומר ניתן לשנות את ערכיו מאוחר יותר. התכונה הזו שימושית, אך יש להיזהר מתופעות לוואי לא מכוונות.

ניתן להשתמש בפונקציות set כדי לשנות ערכים של אובייקט Date קיים.

1const date = new Date("2025-01-01");
2
3date.setFullYear(2026);
4date.setMonth(5);   // June
5date.setDate(15);
6
7console.log(date);

• גם ב-setMonth() החודש מבוסס אפס. האובייקט המקורי משתנה ישירות.

הוספה וחיסור של תאריכים

נהוג לבצע חישובי תאריכים באמצעות מילישניות או על ידי שימוש ב-setDate(). לחישובים מבוססי ימים, השימוש ב-setDate() הוא במיוחד אינטואיטיבי ובטוח.

1const date = new Date("2025-01-01");
2
3date.setDate(date.getDate() + 7);
4console.log(date);

• בדוגמה זו אנו מחשבים את התאריך 7 ימים לאחר התאריך הנתון. גם אם ההוספה עוברת לחודש חדש, השינוי מתבצע אוטומטית.

השוואה בין אובייקטי Date

אפשר להשוות אובייקטי Date כמספרים. הסיבה היא שההשוואה מתבצעת על ערך המילישניות הפנימי.

1const a = new Date("2025-01-01");
2const b = new Date("2025-01-10");
3
4console.log(a < b);   // true
5console.log(a > b);   // false

• אם רוצים לקבוע את הסדר הכרונולוגי של תאריכים, אין צורך בהמרה נוספת. אפשר להשתמש ישירות באופרטורי השוואה.

עבודה עם טיימסטמפים (מילישניות)

ניתן להמיר אובייקט Date למספרים ולחזור מהם, כשהם מייצגים את המילישניות (טיימסטמפ). פורמט זה בשימוש נפוץ ב-API-ים או אינטגרציה עם מסדי נתונים.

1const now = Date.now();
2console.log(now);
3
4const date = new Date(now);
5console.log(date);

• הפונקציה Date.now() מחזירה את הזמן הנוכחי במילישניות. זה מאוד שימושי כאשר רוצים לשמור או להשוות את הערך כמספר.

עיצוב תאריכים כמחרוזות

הצגת אובייקט Date כפי שהוא לרוב תביא לתוצאה שלא בהכרח מתאימה לדרישותיך. לכן, כדאי לעצב אותו באופן מפורש לפי הצורך שלך.

1const date = new Date("2025-01-01");
2
3const formatted = `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
4console.log(formatted);

• באמצעות עיצוב ידני כזה, ניתן לשלוט באופן מלא בפורמט התצוגה. בעבודה מעשית, לרוב נעזרים בספריות ייעודיות למטרה זו.

הבדל בין זמן UTC לזמן מקומי

אובייקט Date מספק מתודות להתייחסות לזמן מקומי ולזמן UTC. חשוב להבין היטב את ההבדלים למטרות אינטגרציה עם שרתים ותקינות בינלאומית.

1const date = new Date();
2
3console.log(date.getHours());    // Local time (hours)
4console.log(date.getUTCHours()); // UTC time (hours)

• המתודות getUTC* תמיד מחזירות ערכים לפי UTC. היו זהירים במיוחד בעת עיבוד נתונים בין אזורי זמן שונים.

אזהרות בעת שימוש באובייקטי תאריך

Date נוח לשימוש, אך יש בו גם צדדים בעייתיים. במיוחד, חודש מבוסס אפס והאפשרות לשנות את האובייקט הם מקורות נפוצים לבאגים.

בואו נביט בדוגמאות למטה כדי לראות את ההשפעות של העובדה ש-Date הוא בר־שינוי.

1const original = new Date("2025-01-01");
2const copy = new Date(original);
3
4copy.setDate(10);
5
6console.log(original);
7console.log(copy);

• אם ברצונך לשמור על התאריך והשעה המקוריים, תמיד צור עותק. עצם המודעות לנקודה הזו תסייע להימנע מבאגים לא רצויים.

סיבות לכך ש-Date קשה לשימוש וקריטריונים לשימוש בספריות

אובייקט Date מספק תכונות מספקות כפונקציה סטנדרטית, אך בפועל יש מצבים שבהם קשה להשתמש בו. בעיות טיפוסיות כוללות את העובדה שחודשים וימי השבוע מתחילים מאפס, נטייה לבלבל בין זמן מקומי ל-UTC, והעובדה שהאובייקט הוא בר־שינוי. בעיות אלו יכולות לגרום ליותר באגים ככל שעיבוד התאריכים מתרבה.

Date מספיק לשליפה והשוואה פשוטות של תאריכים, אך קריאות ותחזוקת הקוד נוטות לרדת כאשר יש יותר חישובי תאריך או עיצוב תצוגה.

אם יש לך דרישות כמו הדוגמאות הבאות, מומלץ לשקול שימוש בספריות תאריכים קלות כמו dayjs או date-fns.

• אתה צריך לטפל במפורש באזורי זמן
• אתה נדרש לעיתים קרובות לבצע חישובי תאריך או מרווחים
• אתה רוצה לשנות בפשטות ובגמישות את פורמט התצוגה
• אתה רוצה לטפל בתאריכים ובשעות בצורה בלתי ניתנת לשינוי (immutably)

סיכום

אובייקטי Date הם הכלי הבסיסי ביותר לטיפול בתאריך ושעה ב-JavaScript. על ידי הבנת הניואנסים שלו וביצוע יצירה, שליפה, חישוב ועיצוב נאותים, ניתן להשתמש בו בביטחון גם בעבודה אמיתית.

לאחר שליטה ביסודות, השימוש בספריות תאריכים לפי הצורך הוא פתרון פרקטי.

תוכלו לעקוב אחר המאמר שלמעלה באמצעות Visual Studio Code בערוץ היוטיוב שלנו. נא לבדוק גם את ערוץ היוטיוב.

YouTube Video