前端判斷節(jié)假日的詳細代碼舉例
更新時間:2024年08月02日 08:26:00 作者:zh?q
因為要做一個日歷控件,遇到國家法定節(jié)假日,怎么實現(xiàn)此功能呢?這篇文章主要給大家介紹了關(guān)于前端判斷節(jié)假日的相關(guān)資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下
安裝并引入
第一種: npm i chinese-days import chineseDays from 'chinese-days' 第二種: 直接瀏覽器引入,會跟隨國務(wù)院發(fā)布更新 <script src="https://cdn.jsdelivr.net/npm/chinese-days/dist/index.min.js"></script> <script> const { isHoliday } = chineseDays console.log(isHoliday('2022-01-01')) </script>
直接調(diào)用
isWorkday 檢查某個日期是否為工作日 console.log(isWorkday('2024-01-01')); // false isHoliday 檢查某個日期是否為節(jié)假日 console.log(isHoliday('2024-01-01')); // true isInLieu 檢查某個日期是否為調(diào)休日 getDayDetail 檢查指定日期是否是工作日 // 示例用法 如果指定日期是工作日,則返回 true 和工作日名稱,如果是被調(diào)休的工作日, 返回 true 和節(jié)假日詳情。如果是節(jié)假日,則返回 false 和節(jié)假日詳情。 // 正常工作日 周五 console.log(getDayDetail('2024-02-02')); // { "date": "2024-02-02", "work":true,"name":"Friday"} // 節(jié)假日 周末 console.log(getDayDetail('2024-02-03')); // { "date": "2024-02-03", "work":false,"name":"Saturday"} // 調(diào)休需要上班 console.log(getDayDetail('2024-02-04')); // { "date": "2024-02-04", "work":true,"name":"Spring Festival,春節(jié),3"} // 節(jié)假日 春節(jié) console.log(getDayDetail('2024-02-17')); // { "date": "2024-02-17", "work":false,"name":"Spring Festival,春節(jié),3"}
獲取指定日期范圍內(nèi)的所有節(jié)假日
getHolidaysInRange 獲取指定日期范圍內(nèi)的所有節(jié)假日 接收起始日期和結(jié)束日期,并可選地決定是否包括周末。 如果包括周末,則函數(shù)會返回包括周末在內(nèi)的所有節(jié)假日;否則,只返回工作日的節(jié)假日。 即使不包括周末,周末的節(jié)假日仍然會被返回 // 示例用法 const start = '2024-04-26'; const end = '2024-05-06'; // 獲取從 2024-05-01 到 2024-05-10 的所有節(jié)假日,包括周末 const holidaysIncludingWeekends = getHolidaysInRange(start, end, true); console.log('Holidays including weekends:', holidaysIncludingWeekends.map(d => getDayDetail(d))); // 獲取從 2024-05-01 到 2024-05-10 的節(jié)假日,不包括周末 const holidaysExcludingWeekends = getHolidaysInRange(start, end, false); console.log('Holidays excluding weekends:', holidaysExcludingWeekends.map(d => getDayDetail(d)));
取指定日期范圍內(nèi)的工作日列表
接收起始日期和結(jié)束日期,并可選地決定是否包括周末。如果包括周末,則函數(shù)會返回包括周末在內(nèi)的所有工作日;否則,只返回周一到周五的工作日。 // 示例用法 const start = '2024-04-26'; const end = '2024-05-06'; // 獲取從 2024-05-01 到 2024-05-10 的所有工作日,包括周末 const workdaysIncludingWeekends = getWorkdaysInRange(start, end, true); console.log('Workdays including weekends:', workdaysIncludingWeekends); // 獲取從 2024-05-01 到 2024-05-10 的工作日,不包括周末 const workdaysExcludingWeekends = getWorkdaysInRange(start, end, false); console.log('Workdays excluding weekends:', workdaysExcludingWeekends);
查找工作日
查找從今天開始 未來的第 {deltaDays} 個工作日。 // 查找從今天開始 未來的第 {deltaDays} 個工作日 // 如果 deltaDays 為 0,首先檢查當(dāng)前日期是否為工作日。如果是,則直接返回當(dāng)前日期。 // 如果當(dāng)前日期不是工作日,會查找下一個工作日。 const currentWorkday = findWorkday(0); console.log(currentWorkday); // 查找從今天開始未來的第一個工作日 const nextWorkday = findWorkday(1); console.log(nextWorkday); // 查找從今天開始之前的前一個工作日 const previousWorkday = findWorkday(-1); console.log(previousWorkday); // 可以傳第二個參數(shù) 查找具體日期的上下工作日 // 查找從 2024-05-18 開始,未來的第二個工作日 const secondNextWorkday = findWorkday(2, '2024-05-18'); console.log(secondNextWorkday);
獲取 24 節(jié)氣的日期
import { getSolarTerms } from "chinese-days"; /** 獲取范圍內(nèi) 節(jié)氣日期數(shù)組 */ const solarTerms = getSolarTerms("2024-05-01", "2024-05-20"); solarTerms.forEach(({ date, term, name }) => { console.log(`${name}: ${date}, ${term}`); }); // 立夏: 2024-05-05, the_beginning_of_summer // 小滿: 2024-05-20, lesser_fullness_of_grain // 沒有節(jié)氣 返回 [] getSolarTerms("2024-05-21", "2024-05-25"); // return [] /* 不傳 end 參數(shù), 獲取某天 節(jié)氣 */ getSolarTerms("2024-05-20"); // return: [{date: '2024-05-20', term: 'lesser_fullness_of_grain', name: '小滿'}]
陽歷轉(zhuǎn)換農(nóng)歷
// 2097-8-7 console.log(getLunarDate('2097-08-07')) // 2057-9-28 console.log(getLunarDate('2057-09-28')) // { // date: "2057-09-28", // lunarYear: 2057, // lunarMon: 8, // lunarDay: 30, // isLeap: false, // lunarDayCN: "三十", // lunarMonCN: "八月", // lunarYearCN: "二零五七", // yearCyl: "丁丑", // monCyl: "己酉", // dayCyl: "戊子", // zodiac: "牛" // } // 非閏月 和 閏月例子 console.log(getLunarDate('2001-04-27')) console.log(getLunarDate('2001-05-27'))
根據(jù)陽歷日期區(qū)間,批量獲取農(nóng)歷日期
console.log(getLunarDatesInRange('2001-05-21', '2001-05-26'))
農(nóng)歷轉(zhuǎn)換陽歷
當(dāng)為陰歷閏月的時候,會出現(xiàn)一個農(nóng)歷日期對應(yīng)兩個陽歷日期的情況,所以返回對象形式。 console.log(getSolarDateFromLunar('2001-03-05')) // {date: '2001-03-29', leapMonthDate: undefined} console.log(getSolarDateFromLunar('2001-04-05')) // {date: '2001-04-27', leapMonthDate: '2001-05-27'}
總結(jié)
到此這篇關(guān)于前端判斷節(jié)假日的文章就介紹到這了,更多相關(guān)前端判斷節(jié)假日內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實例
這篇文章主要介紹了JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實例,本文先是講解了聲明數(shù)組的方法,然后對4個函數(shù)使用給出了一些例子,需要的朋友可以參考下2014-08-08奉獻給JavaScript初學(xué)者的編寫開發(fā)的七個細節(jié)
每種語言都有它特別的地方,對于JavaScript來說,使用var就可以聲明任意類型的變量,這門腳本語言看起來很簡單,然而想要寫出優(yōu)雅的代碼卻是需要不斷積累經(jīng)驗的。本文利列舉了JavaScript初學(xué)者應(yīng)該注意的七個細節(jié),與大家分享。2011-01-01javascript解析xml實現(xiàn)省市縣三級聯(lián)動的方法
這篇文章主要介紹了javascript解析xml實現(xiàn)省市縣三級聯(lián)動的方法,涉及javascript針對節(jié)點的操作與XML文件解析的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07JavaScript 面向?qū)ο蠡A(chǔ)簡單示例
這篇文章主要介紹了JavaScript 面向?qū)ο蠡A(chǔ),結(jié)合簡單實例形式分析了JavaScript面向?qū)ο蟪绦蛟O(shè)計中類的定義、類方法與屬性相關(guān)操作技巧,需要的朋友可以參考下2019-10-10JavaScript canvas實現(xiàn)圍繞旋轉(zhuǎn)動畫
這篇文章主要為大家詳細介紹了JavaScript canvas實現(xiàn)圍繞旋轉(zhuǎn)動畫,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-11-11JavaScript中利用Array filter() 方法壓縮稀疏數(shù)組
Array filter() 方法會跳過稀疏數(shù)組中缺少的元素,它的返回數(shù)組總是稠密的。這篇文章給大家介紹了JavaScript中利用Array filter() 方法壓縮稀疏數(shù)組的相關(guān)知識,需要的朋友參考下2018-02-02