Date-fns Notları ve İpuçları

İçindekiler

1. Kurulum
2. Parse Etme
3. Formatlama
4. Manipülasyon
5. Karşılaştırma
6. Alma ve Ayarlama
7. Zaman Dilimleri
8. Aralıklar
9. Süre
10. Yardımcı Fonksiyonlar

Kurulum

date-fns kütüphanesini kurun:

npm install date-fns

Parse Etme

Stringleri Date nesnelerine çevirme:

import { parse, parseISO } from 'date-fns'

// Belirli bir format ile bir stringi parse etme
const date1 = parse('2021-01-01', 'yyyy-MM-dd', new Date())

// ISO 8601 formatında bir stringi parse etme
const date2 = parseISO('2021-01-01T00:00:00.000Z')

Formatlama

Date nesnelerini stringlere dönüştürme:

import { format } from 'date-fns'

const date = new Date(2021, 0, 1)

// Temel formatlama
console.log(format(date, 'yyyy-MM-dd')) // '2021-01-01'

// Karmaşık formatlama
console.log(format(date, "EEEE, MMMM do 'at' h:mm a")) // 'Cuma, 1 Ocak'ta 12:00 AM'

// Yerelleştirilmiş formatlama
import { fr } from 'date-fns/locale'
console.log(format(date, "d MMMM yyyy", { locale: fr })) // '1 janvier 2021'

Manipülasyon

Tarihleri değiştirme veya ekleme:

import { addDays, subMonths, setYear } from 'date-fns'

const date = new Date(2021, 0, 1)

// 7 gün ekleme
const newDate1 = addDays(date, 7)

// 3 ay çıkarma
const newDate2 = subMonths(date, 3)

// Yılı 2022 olarak ayarlama
const newDate3 = setYear(date, 2022)

Karşılaştırma

Tarihleri karşılaştırma:

import { isAfter, isBefore, isEqual, differenceInDays } from 'date-fns'

const date1 = new Date(2021, 0, 1)
const date2 = new Date(2021, 6, 1)

console.log(isAfter(date2, date1)) // true
console.log(isBefore(date1, date2)) // true
console.log(isEqual(date1, date2)) // false

// İki tarih arasındaki gün sayısını alma
console.log(differenceInDays(date2, date1)) // 181

Alma ve Ayarlama

Bir tarihin bileşenlerini alma veya ayarlama:

import { getYear, getMonth, setDate, setHours } from 'date-fns'

const date = new Date(2021, 0, 1, 12, 0)

console.log(getYear(date)) // 2021
console.log(getMonth(date)) // 0 (Ocak)

const newDate1 = setDate(date, 15) // Gün olarak 15'i ayarla
const newDate2 = setHours(date, 14) // Saati 14 (2 PM) olarak ayarla

Zaman Dilimleri

Zaman dilimleri ile çalışma (date-fns-tz paketi gerektirir):

import { zonedTimeToUtc, utcToZonedTime, format } from 'date-fns-tz'

const date = new Date('2021-01-01T00:00:00.000Z')
const timeZone = 'America/New_York'

// UTC zamanını belirli bir zaman dilimine dönüştürme
const nyDate = utcToZonedTime(date, timeZone)

// Tarihi formatla, zaman dilimi adını göster
console.log(format(nyDate, 'yyyy-MM-dd HH:mm:ss zzz', { timeZone }))
// '2020-12-31 19:00:00 EST'

// Bir zoned zamanı UTC'ye dönüştürme
const utcDate = zonedTimeToUtc(nyDate, timeZone)

Aralıklar

Zaman aralıkları ile çalışma:

import { intervalToDuration, eachDayOfInterval } from 'date-fns'

const start = new Date(2021, 0, 1)
const end = new Date(2021, 11, 31)

// Bir aralığın süresini alma
const duration = intervalToDuration({ start, end })
console.log(duration) // { years: 0, months: 11, days: 30, hours: 0, ... }

// Bir aralıktaki tüm günleri alma
const days = eachDayOfInterval({ start, end })

Süre

Sürelerle çalışma:

import { add, formatDuration } from 'date-fns'

const date = new Date(2021, 0, 1)

// Bir tarihe süre ekleme
const newDate = add(date, { years: 1, months: 2, days: 3 })

// Bir süreyi formatlama
console.log(formatDuration({ years: 2, months: 9, days: 1 }))
// '2 yıl 9 ay 1 gün'

Yardımcı Fonksiyonlar

Diğer kullanışlı fonksiyonlar:

import { isLeapYear, getDaysInMonth, startOfWeek, endOfMonth } from 'date-fns'

const date = new Date(2021, 1, 1) // 1 Şubat 2021

console.log(isLeapYear(date)) // false
console.log(getDaysInMonth(date)) // 28

const weekStart = startOfWeek(date)
const monthEnd = endOfMonth(date)