小程序中怎么計(jì)算距離某個(gè)節(jié)日還有多少天

這篇文章將為大家詳細(xì)講解有關(guān)小程序中怎么計(jì)算距離某個(gè)節(jié)日還有多少天，小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

先看一下頁(yè)面效果：

頁(yè)面是這樣的：

好了，正文如下

最近碰到個(gè)需求需要計(jì)算，距離圣誕、元旦、高考、國(guó)慶啊等最近一個(gè)節(jié)日，還剩多少天。

因?yàn)楹笈_(tái)沒(méi)空理我，所以本文講解在js中如何解決這個(gè)需求。(建議實(shí)際中獲取標(biāo)準(zhǔn)時(shí)間，當(dāng)前時(shí)間有點(diǎn)不靠譜)

首先肯定是要用 new Date() 獲得當(dāng)前時(shí)間對(duì)象，然后再用它的一些方法獲取當(dāng)前年月日等，根據(jù)年月日判斷。

先看一下new Date()對(duì)象常用的方法。

  getYear(); //獲取當(dāng)前年份（2位）
  getFullYear(); //獲取檔期年份（4位）
  getMonth(); // 獲取當(dāng)前月份(0-11,0代表1月,很神經(jīng),獲取日是正常的1-31...)
  getDate(); // 獲取當(dāng)前日(1-31)
  getDay(); //獲取當(dāng)前星期幾(0-6,0代表星期天...)
  getTime(); //獲取當(dāng)前時(shí)間(從1970.1.1開(kāi)始的毫秒數(shù))，注意，是毫秒數(shù)?。?！
  getHours(); // 獲取當(dāng)前小時(shí)數(shù)(0-23)
  getMinutes(); // 獲取當(dāng)前分鐘數(shù)(0-59)
  getSeconds(); // 獲取當(dāng)前秒數(shù)
  getMilliseconds(); //獲取當(dāng)前毫秒數(shù)
  toLocalDateString(); // 獲取當(dāng)前日期

一開(kāi)始，我是先取得Date()對(duì)象的月，日，然后判斷月份等不等于某個(gè)日期的月份。分三種情況...

  let mydate = new Date();
  let year = mydate.getFullYear();
  let month = mydate.getMonth();
  let day = mydate.getDate();
  
  // 判斷距離下個(gè)高考還需要多久
  
  if(month < 6){
    // ...
  }else if(month>6){
    // ...
  }else{
    if(day == 7){
      
    }else{
      
    }
  }

但是轉(zhuǎn)念一想，這個(gè)做法太繁瑣了。于是換個(gè)思路，直接獲取目標(biāo)日期的時(shí)間戳和當(dāng)前日期的時(shí)間戳,兩者之間進(jìn)行比較。

代碼如下：

 // 公共API
 // @params 傳入節(jié)日日期的str，例如'-10-1','-12-25','-1-1'等
 // @return resolve()回調(diào)的是個(gè)數(shù)組
 // 數(shù)組第一個(gè)參數(shù)返回的是'今'或者'明'這個(gè)字符串，第二個(gè)參數(shù)返回的是還剩多少天
 settime:function(str){
  
  let promis = new Promise((resolve,reject)=>{
   
   // 獲取時(shí)間對(duì)象
   let dateObj = new Date()
   let year = dateObj.getFullYear()
   let month = dateObj.getMonth()
   let day = dateObj.getDate()
   
   // 求當(dāng)前日期和時(shí)間的時(shí)間戳
   // 這里需要注意的是，利用new Date().getMonth()得到的是0-11的數(shù)值
   // 而用new Date('year-month-day')初始化求今天0點(diǎn)0分0秒時(shí)的Month
   // 需要傳入的是1-12的,也就是month要+1

   let now = new Date() 
   let target = new Date(year + str)  // 目標(biāo)日期
   
   // 先保存起來(lái)，后續(xù)還會(huì)用
   let nowtime = now.getTime()    // 當(dāng)前日期時(shí)間戳
   let sjc = nowtime - target.getTime() // 時(shí)間差

    // 回調(diào)的2個(gè)參數(shù)，會(huì)組成數(shù)組傳入回調(diào)函數(shù)中
   // 這2個(gè)信息會(huì)直接賦值顯示到頁(yè)面中
   let theyear = '今'
   let thedays = 0

   if (sjc < 0) {

    // 還未過(guò)今年某個(gè)節(jié)日
    theyear = '今'
    thedays = Math.floor(Math.abs(sjc / (24 * 60 * 60 * 1000)))

   } else if (sjc > 0) {

    // 已經(jīng)過(guò)了今年某個(gè)節(jié)日
    let mn = year - 0 + 1
    let mntarget = new Date(mn + str)
    let sjc2 = mntarget.getTime() - nowtime
    theyear = '明'
    thedays = Math.floor(sjc2 / (24 * 60 * 60 * 1000))

   } else {
    // 一年的節(jié)日期間
    theyear = '今'
    thedays = 0
   }
   let arr = [theyear, thedays]
   resolve(arr)
  })

  return promis
 }

我頁(yè)面的wxml是這樣的

<view>
 距離<text>{{gk_year}}</text>年高考還剩：<text>{{gk_days}}</text>天
</view>
<view>
距離<text>{{gq_year}}</text>年國(guó)慶還剩：<text>{{gq_days}}</text>天
</view>
<view>
距離<text>{{yd_year}}</text>年元旦還剩：<text>{{yd_days}}</text>天
</view>
<view>
距離<text>{{sd_year}}</text>年圣誕還剩：<text>{{sd_days}}</text>天
</view>

在頁(yè)面中這樣調(diào)用：

 /**
  * 生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面初次渲染完成
  */
 onReady: function () {
  // 設(shè)置距離xx還剩多少天
  this.setgk() // 高考
  this.setgq() // 國(guó)慶
  this.setyd() // 元旦
  this.setsd() // 圣誕
 },

 /**
  * 求距離高考還剩多少天
  */
 setgk:function(){
  let promis = this.settime('-06-07')
  let that = this

  promis.then((arr)=>{
   that.setData({
    gk_year:arr[0],
    gk_days:arr[1]
   })
  })
 },

 // 設(shè)置國(guó)慶信息
 setgq:function(){
  let promis = this.settime('-10-01')
  let that = this

  promis.then((arr) => {
   that.setData({
    gq_year: arr[0],
    gq_days: arr[1]
   })
  })
 },

 // 設(shè)置元旦
 setyd:function(){
  let promis = this.settime('-01-01')
  let that = this

  promis.then((arr) => {
   that.setData({
    yd_year: arr[0],
    yd_days: arr[1]
   })
  })
 },
 // 設(shè)置圣誕
 setsd: function () {
  let promis = this.settime('-12-25')
  let that = this

  promis.then((arr) => {
   that.setData({
    sd_year: arr[0],
    sd_days: arr[1]
   })
  })
 },

附注：調(diào)用的時(shí)候要人為的補(bǔ)全日期，也就是不足10要在前面補(bǔ)個(gè)0，這部分代碼在開(kāi)發(fā)工具上就算不補(bǔ)全也是可以用的。但是在iphone 6s ios12下，不補(bǔ)全，就無(wú)效。不知道這個(gè)是不是bug，其他手機(jī)沒(méi)測(cè)試，不清楚不補(bǔ)全是否可用。建議用的時(shí)候還是人為補(bǔ)全日期吧。

小結(jié)，編程就是這樣，很多時(shí)候我們換個(gè)思路，得出來(lái)的思路會(huì)比之前的好很多。所以，就算當(dāng)前項(xiàng)目很緊，做完了之后，還是要多多思考。將一些當(dāng)時(shí)很別扭的地方多想一下，沒(méi)準(zhǔn)就能想出更好的解決思路。

這一點(diǎn)無(wú)論是對(duì)個(gè)人還是項(xiàng)目，都是有益的。

10-24更新備注：取當(dāng)前日期的時(shí)間戳計(jì)算天數(shù)存在bug，有1天的差異。所以將settime:function()  中獲取當(dāng)前日期的時(shí)間戳，改成了獲取當(dāng)前時(shí)間的時(shí)間戳，因?yàn)楹罄m(xù)是用Math.floor()函數(shù)向下取整，能夠解決時(shí)間點(diǎn)帶來(lái)的時(shí)間戳差異的問(wèn)題。
最后看一下效果（第一張圖片上的字和第二張最底部的灰色字體，2018-10-24更新）

關(guān)于“小程序中怎么計(jì)算距離某個(gè)節(jié)日還有多少天”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。