极客笔记如何在JavaScript中存储给定两个日期之间的所有日期于数组中
有时候，我们需要获取给定日期范围内的所有日期。在本教程中，我们将取出两个日期，并找出两个日期之间的所有日期。同时，我们将把所有日期存储在一个数组中。
在这里，我们将学习三种方法来存储给定两个日期之间的所有日期于一个数组中。
使用while循环和setDate()方法
我们可以使用while循环来迭代，使用setDate()方法来设置日期对象中的日期。在每次迭代时，我们可以将日期增加一天并将其设置为date1。
语法
用户可以按照以下语法来使用while循环和setDate()方法来获取两个日期之间的所有日期。
while (date1 <= date2) {
dateArray.push(new Date(date1));
date1.setDate(date1.getDate() + 1);
}
在上述的语法中，date1是起始日期，date2是结束日期。
步骤
步骤1 - 创建两个日期。
步骤2 - 使用while循环，检查date1是否小于date2。
步骤3 - 从date1创建一个新的日期，并将其推送到dateArray中。
步骤4 - 使用getDate()方法获取date1的日期，并加1。
步骤5 - 使用setDate()方法设置一个新的日期。
示例1
在下面的示例中，我们使用Date对象创建了date1和date2。然后，我们实施了上述算法来获取两个日期之间的所有日期。在输出中，用户可以观察到date1和date2之间的所有日期。
<html>
<body>
<h2>Using the <i> setDate() method and while loop</i> to get all dates between two dates in the array format. </h2>
<div id = "output"></div>
<script>
var output = document.getElementById('output');
var date1 = new Date("2023-01-01");
var date2 = new Date("2023-01-11");
output.innerHTML += "The date1 is " + date1 + "<br/>";
output.innerHTML += "The date2 is " + date2 + "<br/>";
var dateArray = [];
while (date1 <= date2) {
dateArray.push(new Date(date1));
date1.setDate(date1.getDate() + 1);
}
output.innerHTML += "The date array is <br/>";
for (let i = 0; i < dateArray.length; i++) {
output.innerHTML += dateArray[i] + " <br/>";
}
</script>
</body>
</html>
使用for循环和日期的总毫秒数
在这种方法中，我们将获取第一个日期和第二个日期的总毫秒数。然后，我们将持续将一天的毫秒数添加到当前日期的总毫秒数，并使用新的毫秒数来创建日期。
通过这种方式，我们可以找到给定两个日期之间的所有日期并将它们存储在数组中。
语法
用户可以按照下面的语法使用for循环和日期的总毫秒数来获取两个日期之间的所有日期。
for (var currentMillis = startMillis; currentMillis < lastMillis; currentMillis += milliOf1Day) {
// pushing updated date to the array
dateArray.push(new Date(currentMillis));
}
在以上的语法中，milliOf1Day是一天的总毫秒数。
步骤
步骤1 - 获取当前日期和上一个日期的总毫秒数。
步骤2 - 使用for循环，并使用开始日期的总毫秒数初始化currentMillis变量。
步骤3 - 用for循环迭代直到当前毫秒数小于最后日期的毫秒数。
步骤4 - 同样，将一天的毫秒数添加到currentMillis中。
步骤5 - 使用currentMillis创建一个新的日期并将其推送到for循环中的dateArray变量中。
示例2
在这个示例中，我们有一个变量milliOf1Day，其中存储了一天的总毫秒数。然后，我们使用for循环和毫秒数来实现以上算法，以获取两个日期之间的所有日期。
<html>
<body>
<h2>Using the <i> setDate() method and while loop </i> to get all dates between two dates in the array format. </h2>
<div id = "output"></div>
<script>
var output = document.getElementById('output');
var firstDate = new Date("2022-11-01");
var secondDate = new Date("2022-11-07");
function getArrayOfDates(firstDate, secondDate) {
// calculate milli seconds of 1 day
var milliOf1Day = 24 * 60 * 60 * 1000;
// calculate the total milliseconds of the start and end date
let startMillis = firstDate * 1;
let lastMillis = secondDate * 1;
var dateArray = [];
// In the for-loop, on every iteration, add the total milli seconds of 1 day to current milliseconds, and create a new date
for (var currentMillis = startMillis; currentMillis < lastMillis; currentMillis += milliOf1Day) {
// pushing updated date to the array
dateArray.push(new Date(currentMillis));
}
return dateArray;
}
let dates = getArrayOfDates(firstDate, secondDate)
output.innerHTML += "The firstDate is " + firstDate + "<br/>";
output.innerHTML += "The secondDate is " + secondDate + "<br/>";
output.innerHTML += "The date array is <br/>";
// printing the date array
for (let i = 0; i < dates.length; i++) {
output.innerHTML += dates[i] + " <br/>";
}
</script>
</body>
</html>
使用momentJS库
momentJS库允许我们操作日期。
语法
用户可以按照以下语法使用momentJS库来获取两个日期之间的所有日期。
while (currentDate.add(1, "days").diff(lastDate) < 0) {
allDates.push(currentDate.clone().toDate());
}
在上面的语法中，我们使用了momentJS库的add()和diff()方法。
示例3
在下面的示例中，我们从用户那里获取起始日期和结束日期。然后，我们使用输入的日期，利用momentJS库创建了日期。
接下来，我们使用add()方法将一天添加到当前日期。同时，我们使用diff()方法获取当前日期与结束日期之间的差异。
<html>
<head>
<script src ="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/momentrange/4.0.1/moment-range.js"> </script>
</head>
<body>
<h2>Using the <i> setDate() method and while loop </i> to get all dates between two dates in the array format. </h2>
<div id="output"> </div>
<button onclick="getArrayOfDates()"> Get array of Dates</button>
<script>
var output = document.getElementById('output');
function getArrayOfDates() {
let allDates = [];
let startDate = prompt("Enter start date in the MM / DD / YYYY format", "09/23/2022");
let endDate = prompt("Enter end date in the MM / DD / YYYY format ", "10/23/2022");
// create a new date from the custom input
let currentDate = moment.utc(new Date(startDate)).startOf("day");
let lastDate = moment.utc(new Date(endDate)).startOf("day");
// add one day to the current date and check the difference between the current date and the last date
while (currentDate.add(1, "days").diff(lastDate) < 0) {
allDates.push(currentDate.clone().toDate());
}
allDates.push(currentDate.clone().toDate());
output.innerHTML += "The currentDate is " + currentDate + "<br/>";
output.innerHTML += "The lastDate is " + lastDate + "<br/>";
output.innerHTML += "The date array is <br/>";
for (let i = 0; i < allDates.length; i++) {
output.innerHTML += allDates[i] + " <br/>";
}
}
</script>
</body>
</html>