【Javascript】日期智能化显示

作者: 雨水之后 | 来源:发表于2017-11-29 14:30 被阅读15次

    一个时间段,有开始及结束日期,格式均为YYYY-MM-DD

    函数传入参数的格式为makeFriendlyDates(["2016-07-01", "2018-10-04"]);,前者为开始日期,后者为结束日期。

    函数期望返回结果为以下格式:

    如果年月日均不相同,则返回:[ 'July 1st, 2016', 'October 4th, 2018' ]
    如果年份相同,则返回:[ 'July 1st', 'October 4th' ]
    如果年份和月份都相同,则返回:[ 'July 1st', '4th' ]

    function makeFriendlyDates(arr) {
    
      //创建结果数组,按照新格式存入
      var result = arr.map(function(e){
        return newDateFormat(e);
      });
    
      //如果年份相同
      if(result[0].substr(-4)===result[1].substr(-4)){
    
        //两个字符串都去掉年份
        result = result.map(function(e){
          return e.substring(0,e.length-6);
        });
    
        //定义月份名称的正则
        //挑出开始月份及结束月份
        var regMonth = /[a-zA-Z]{3,9}/g;
        var startMonth = result[0].match(regMonth).join('');
        var endMonth = result[1].match(regMonth).join('');
    
        //月份相同的情况
        if(startMonth===endMonth){
          //结束日期把月份删掉
          result[1] = result[1].substring(endMonth.length).trim();
          return result;
        }
        else{
          return result;
        }
      }
      else{
        return result;
      }
    
      //转化日期表现格式的函数
      function newDateFormat(str){
    
        //把字符串变为数组便于处理
        let arr = str.split("-");
        return getMonth(arr[1]) + " " + getDay(arr[2]) + ", " + arr[0];
      }
    
      //获取月份名称
      function getMonth(m){
        let month = ['January','February','March','April','May','June','July','August','September','October','November','December'];
        m = parseInt(m);
        return month.filter(function(e,i){
          if(m===i+1){
            return month[m-1];
          }
        }).join("");
      }
    
      //获取日名称
      function getDay(d){
        d = parseInt(d);
        if(d===1 || d===21 || d===31){
          return d+"st";
        }
        else if(d===2 || d==22){
          return d+"nd";
        }
        else if(d===3 || d===23){
          return d+"rd";
        }
        else if((d>=4&&d<=20)||(d>=24&&d<=30)){
          return d+"th";
        }
      }
    
    }
    

    THE END.

    相关文章

      网友评论

        本文标题:【Javascript】日期智能化显示

        本文链接:https://www.haomeiwen.com/subject/jewubxtx.html