Javascript 使用JS扩展日期范围？_Javascript_Jquery_Laravel

Javascript 使用JS扩展日期范围？

javascript jquery laravel

Javascript 使用JS扩展日期范围？,javascript,jquery,laravel,Javascript,Jquery,Laravel,我有一个变量{{$daterange}}，带有类似这样的json { "starts_at": "2020-05-20", "ends_at": "2020-05-23" }, { "starts_at": "2020-05-24", "ends_at": "2020-05-26" }, { "starts_at": "2020-05-27", "ends_at": "2020-05-29" } 我想做的是扩展这样的东西 2020-05-20

我有一个变量

{{$daterange}}

，带有类似这样的json

 {
   "starts_at": "2020-05-20",
   "ends_at": "2020-05-23"
 },
 {
   "starts_at": "2020-05-24",
   "ends_at": "2020-05-26"
 },
 {
   "starts_at": "2020-05-27",
   "ends_at": "2020-05-29"
 }

我想做的是扩展这样的东西

我计划在

expandedDate

变量中指定这些日期

 var expandedDate = [ ....dates ];

这应该使用jquery/js来完成

更新*

最近，这段代码工作正常，可以获取2个日期之间的所有日期。它将列出代码中写入的2个日期范围之间的所有日期

    // Returns an array of dates between the two dates
    var getDates = function(startDate, endDate) {
    var dates = [],
        currentDate = startDate,
        addDays = function(days) {
            var date = new Date(this.valueOf());
            date.setDate(date.getDate() + days);
            return date;
        };
    while (currentDate <= endDate) {
        dates.push(currentDate);
        currentDate = addDays.call(currentDate, 1);
    }
    return dates;
    };

    // Usage
    var dates = getDates(new Date(2013,10,22), new Date(2013,11,25));                                                                                                           
    dates.forEach(function(date) {
        console.log(date);
    });

//返回两个日期之间的日期数组
var getDates=函数（开始日期、结束日期）{
var日期=[]，
当前日期=开始日期，
addDays=函数（天）{
var date=新日期（this.valueOf（））；
date.setDate（date.getDate（）+天）；
返回日期；
};
while（currentDate我想我错过了你对现有代码的更新。下面的代码似乎使用javascript获得了所需的输出。只是在每个步骤中添加了注释作为解释。希望对你有所帮助
//sample input data
var daterange = [{
    "starts_at": "2020-05-27",
    "ends_at": "2020-06-23"
  },
  {
    "starts_at": "2020-05-24",
    "ends_at": "2020-05-26"
  },
  {
    "starts_at": "2020-05-27",
    "ends_at": "2020-05-29"
  }
];


// function to get dates between two dates
var getDaysAsArray = function(start_date, end_date) {
  for (var arr = [], d = new Date(start_date); d <= end_date; d.setDate(d.getDate() + 1)) {
    arr.push(new Date(d));
  }
  return arr;
};

// function to convert date into the format yyyy-mm-dd
var getFormattedDay = function(date) {
  day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
  month = date.getMonth()+1 < 10 ? "0" + (date.getMonth()+1) : date.getMonth()+1;
  year = date.getFullYear();
  return year + "-" + month + "-" + day;
}

//main logic
var expandedDate = [];
//Iterate through the list of arrays in the date range
for (var key in daterange) {
  //get first pair of from and to date
  var from_string = daterange[key].starts_at;
  var to_string = daterange[key].ends_at;

  // convert the string date to date format for from and to.
  var from_date = new Date(from_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));
  var to_date = new Date(to_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));

  // call getDaysAsArray to convert dates into strings and into an array.
  var daylist = getDaysAsArray(from_date, to_date);
  // iterate through the daylist and push it into the final array you want to use
  for (var day in daylist) {
    expandedDate.push(getFormattedDay(daylist[day]));

  }

}
// final result required
console.log(expandedDate);


//示例输入数据
变量日期范围=[{
“开始于”：“2020-05-27”，
“结束于”：“2020-06-23”
},
{
“开始于”：“2020-05-24”，
“结束于”：“2020-05-26”
},
{
“开始于”：“2020-05-27”，
“结束于”：“2020-05-29”
}
];
//函数获取两个日期之间的日期
var getDaysAsArray=函数（开始日期、结束日期）{
对于（var arr=[]，d=new Date（start_Date）；d我想我错过了现有代码的更新。下面的代码似乎使用javascript获得了所需的输出。只是在每个步骤中添加了注释作为解释。希望有帮助
//sample input data
var daterange = [{
    "starts_at": "2020-05-27",
    "ends_at": "2020-06-23"
  },
  {
    "starts_at": "2020-05-24",
    "ends_at": "2020-05-26"
  },
  {
    "starts_at": "2020-05-27",
    "ends_at": "2020-05-29"
  }
];


// function to get dates between two dates
var getDaysAsArray = function(start_date, end_date) {
  for (var arr = [], d = new Date(start_date); d <= end_date; d.setDate(d.getDate() + 1)) {
    arr.push(new Date(d));
  }
  return arr;
};

// function to convert date into the format yyyy-mm-dd
var getFormattedDay = function(date) {
  day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
  month = date.getMonth()+1 < 10 ? "0" + (date.getMonth()+1) : date.getMonth()+1;
  year = date.getFullYear();
  return year + "-" + month + "-" + day;
}

//main logic
var expandedDate = [];
//Iterate through the list of arrays in the date range
for (var key in daterange) {
  //get first pair of from and to date
  var from_string = daterange[key].starts_at;
  var to_string = daterange[key].ends_at;

  // convert the string date to date format for from and to.
  var from_date = new Date(from_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));
  var to_date = new Date(to_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));

  // call getDaysAsArray to convert dates into strings and into an array.
  var daylist = getDaysAsArray(from_date, to_date);
  // iterate through the daylist and push it into the final array you want to use
  for (var day in daylist) {
    expandedDate.push(getFormattedDay(daylist[day]));

  }

}
// final result required
console.log(expandedDate);


//示例输入数据
变量日期范围=[{
“开始于”：“2020-05-27”，
“结束于”：“2020-06-23”
},
{
“开始于”：“2020-05-24”，
“结束于”：“2020-05-26”
},
{
“开始于”：“2020-05-27”，
“结束于”：“2020-05-29”
}
];
//函数获取两个日期之间的日期
var getDaysAsArray=函数（开始日期、结束日期）{
对于（var arr=[]，d=新日期（start_Date）；d这是关于如何解决这个问题的完整代码
基于@thommu
        var daterange = [
        {
            "starts_at": "2020-05-24",
            "ends_at": "2020-05-26"
        },
        {
            "starts_at": "2020-05-27",
            "ends_at": "2020-05-29"
        }
        ];


    // function to get dates between two dates
    var getDaysAsArray = function(start_date, end_date) {
    for (var arr = [], d = new Date(start_date); d <= end_date; d.setDate(d.getDate() + 1)) {
        arr.push(new Date(d));
    }
    return arr;
    };

    // function to convert date into the format yyyy-mm-dd
    var getFormattedDay = function(date) {
    day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
    month = date.getMonth() < 10 ? "0" + date.getMonth() : date.getMonth();
    year = date.getFullYear();
    return year + "-" + month + "-" + day;
    }

    //main logic
    var expandedDate = [];
    //Iterate through the list of arrays in the date range
    for (var key in daterange) {
    //get first pair of from and to date
    var from_string = daterange[key].starts_at;
    var to_string = daterange[key].ends_at;

    // convert the string date to date format for from and to.
    var xfrom_date = new Date(from_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));
    var xto_date = new Date(to_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));

    //Add +1 month to correct the data
    var from_date = new Date(xfrom_date.setMonth(xfrom_date.getMonth()+1));
    var to_date = new Date(xto_date.setMonth(xto_date.getMonth()+1));

    // call getDaysAsArray to convert dates into strings and into an array.
    var daylist = getDaysAsArray(from_date, to_date);
        // iterate through the daylist and push it into the final array you want to use
        for (var day in daylist) {
            expandedDate.push(getFormattedDay(daylist[day]));

        }
    }
    //Filter Duplicated Dates
    var dateDuplicate = expandedDate;
    var uniqueDate = [];
    $.each(dateDuplicate, function(i, el){
        if($.inArray(el, uniqueDate) === -1) uniqueDate.push(el);
    });

    // final result required
    console.log(uniqueDate);

var日期范围=[
{
“开始于”：“2020-05-24”，
“结束于”：“2020-05-26”
},
{
“开始于”：“2020-05-27”，
“结束于”：“2020-05-29”
}
];
//函数获取两个日期之间的日期
var getDaysAsArray=函数（开始日期、结束日期）{
对于（var arr=[]，d=新日期（start_Date）；d这是关于如何解决这个问题的完整代码
基于@thommu
        var daterange = [
        {
            "starts_at": "2020-05-24",
            "ends_at": "2020-05-26"
        },
        {
            "starts_at": "2020-05-27",
            "ends_at": "2020-05-29"
        }
        ];


    // function to get dates between two dates
    var getDaysAsArray = function(start_date, end_date) {
    for (var arr = [], d = new Date(start_date); d <= end_date; d.setDate(d.getDate() + 1)) {
        arr.push(new Date(d));
    }
    return arr;
    };

    // function to convert date into the format yyyy-mm-dd
    var getFormattedDay = function(date) {
    day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
    month = date.getMonth() < 10 ? "0" + date.getMonth() : date.getMonth();
    year = date.getFullYear();
    return year + "-" + month + "-" + day;
    }

    //main logic
    var expandedDate = [];
    //Iterate through the list of arrays in the date range
    for (var key in daterange) {
    //get first pair of from and to date
    var from_string = daterange[key].starts_at;
    var to_string = daterange[key].ends_at;

    // convert the string date to date format for from and to.
    var xfrom_date = new Date(from_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));
    var xto_date = new Date(to_string.replace(/(\d{4})-(\d{2})-(\d{2})/, "$1/$2/$3"));

    //Add +1 month to correct the data
    var from_date = new Date(xfrom_date.setMonth(xfrom_date.getMonth()+1));
    var to_date = new Date(xto_date.setMonth(xto_date.getMonth()+1));

    // call getDaysAsArray to convert dates into strings and into an array.
    var daylist = getDaysAsArray(from_date, to_date);
        // iterate through the daylist and push it into the final array you want to use
        for (var day in daylist) {
            expandedDate.push(getFormattedDay(daylist[day]));

        }
    }
    //Filter Duplicated Dates
    var dateDuplicate = expandedDate;
    var uniqueDate = [];
    $.each(dateDuplicate, function(i, el){
        if($.inArray(el, uniqueDate) === -1) uniqueDate.push(el);
    });

    // final result required
    console.log(uniqueDate);

var日期范围=[
{
“开始于”：“2020-05-24”，
“结束于”：“2020-05-26”
},
{
“开始于”：“2020-05-27”，
“结束于”：“2020-05-29”
}
];
//函数获取两个日期之间的日期
var getDaysAsArray=函数（开始日期、结束日期）{
对于（var arr=[]，d=新日期（开始日期）；d看起来它满足了这个问题，如果有重复的日期，我怎么能在这里实现呢？如果有2020-05-1
和另一个2020-05-1
它只会将一个条目显示为2020-05-1
而不是两次？有多种方法可以做到这一点。最简单的方法可能是将其通过过滤器。 函数removeDuplicates（array）{return array.filter（（a，b）=>array.indexOf（a）==b）}；
调用removeDuplicates（expandedDate）；
是一种方法。感谢您的适当响应，非常感谢您的回答。我注意到，变量上的当前json数据设置为5月份，但在console.log中显示为04
或April。感谢您指出Rae。问题在于getFormattedDay函数.getMonth（）为1月返回0，为2月返回1，依此类推…因此我们需要将1添加到从方法获得的值中以解决问题。只需编辑代码以反映以下更改：month=date.getMonth（）+1<10？+0“+（date.getMonth（）+1）：date.getMonth（）+1、 
看起来它满足了这个问题，如果有重复的日期，我怎么在这里实现呢？如果有2020-05-1
和另一个2020-05-1
它只会将一个条目显示为2020-05-1
而不是两次？有多种方法可以做到这一点。最简单的方法可能是将其通过过滤器。函数removeDuplicates（array）{return array.filter（（a，b）=>array.indexOf（a）==b）}；
调用removeDuplicates（expandedDate）；
是一种方法。感谢您的适当响应，非常感谢您的回答。我注意到，变量上的当前json数据设置为5月份，但在console.log中显示为04
或April。感谢您指出Rae。问题在于getFormattedDay函数.getMonth（）为1月返回0，为2月返回1，依此类推…因此我们需要在从方法获得的值中添加1以解决问题。只需编辑代码以反映以下更改：month=date.getMonth（）+1<10？+0“+（date.getMonth（）+1）：date.getMonth（）+1；