Utilizing JavaScript's functional programming to manipulate dynamic values within an array

Question

Utilizing JavaScript's functional programming to manipulate dynamic values within an array

Currently, I am working on a function that aims to extract the first 14 consecutive days (starting from today) using momentJS. Here is what my current function looks like:

let dateArr = Array(14).fill(moment())
    .map((date) => {
        return date.add(1, 'days')
    });

I've realized that fill is suitable for static values, not dynamic ones. How can I modify this code so that it generates an array like this:

['11/12', '11/13', '11/14', etc...]

It seems like I may need to implement some form of recursion to ensure that each day is added sequentially based on the previous iteratee, rather than simply adding one day from the present date in every iteration.

javascript

Answer 1

Answer №1

Array(14).fill(moment())
    .map((date, i) =>  date.add(1, 'days').format('MM/DD'));

OUTPUT:

(14) ["01/13", "01/14", "01/15", "01/16", "01/17", "01/18", "01/19", "01/20", "01/21", "01/22", "01/23", "01/24", "01/25", "01/26"]

UPDATE:

Start from the current date^

Array(14).fill(moment())
    .map((date, i) =>  {
if(i === 0) {
return date.format('MM/DD')
}
return date.add(1, 'days').format('MM/DD')
});

(14) ["01/12", "01/13", "01/14", "01/15", "01/16", "01/17", "01/18", "01/19", "01/20", "01/21", "01/22", "01/23", "01/24", "01/25"]

Answer 2

Array(14).fill(moment())
    .map((date, i) =>  date.add(1, 'days').format('MM/DD'));

OUTPUT:

(14) ["01/13", "01/14", "01/15", "01/16", "01/17", "01/18", "01/19", "01/20", "01/21", "01/22", "01/23", "01/24", "01/25", "01/26"]

UPDATE:

Start from the current date^

Array(14).fill(moment())
    .map((date, i) =>  {
if(i === 0) {
return date.format('MM/DD')
}
return date.add(1, 'days').format('MM/DD')
});

(14) ["01/12", "01/13", "01/14", "01/15", "01/16", "01/17", "01/18", "01/19", "01/20", "01/21", "01/22", "01/23", "01/24", "01/25"]

Answer 3

Answer №2

Instead of populating an array with a single date object, you can ensure that each element in the array contains a separate date object by following this approach:

let currentDate = moment();
let datesArray = Array(14).fill(currentDate)
.map((date, index) => {
    return currentDate.add(index, 'days').clone();
});

The moment.add() method modifies the existing date object instead of returning a new one. To create new date objects for each element in the array, use the clone() method as shown above.

let datesArray = Array(14).fill(moment())
.map((date, index) => {
    return date.clone().add(index, 'days'); // Ensure a new object is created using `clone()`.
});

If you only require a string representation of the date, you can add a format to retrieve it:

let datesArray = Array(14).fill(moment())
.map((date, index) => {
    return date.clone().add(index, 'days').format('MM/DD'); // Create a new object with `clone()` and format the output.
});

Utilize the index variable dynamically to account for adding days based on the array position, where the first position corresponds to today (adding 0 days).

Answer 4

Instead of populating an array with a single date object, you can ensure that each element in the array contains a separate date object by following this approach:

let currentDate = moment();
let datesArray = Array(14).fill(currentDate)
.map((date, index) => {
    return currentDate.add(index, 'days').clone();
});

The moment.add() method modifies the existing date object instead of returning a new one. To create new date objects for each element in the array, use the clone() method as shown above.

let datesArray = Array(14).fill(moment())
.map((date, index) => {
    return date.clone().add(index, 'days'); // Ensure a new object is created using `clone()`.
});

If you only require a string representation of the date, you can add a format to retrieve it:

let datesArray = Array(14).fill(moment())
.map((date, index) => {
    return date.clone().add(index, 'days').format('MM/DD'); // Create a new object with `clone()` and format the output.
});

Utilize the index variable dynamically to account for adding days based on the array position, where the first position corresponds to today (adding 0 days).

Answer 5

Answer №3

It seems like you're looking to retrieve a list of dates starting from today and spanning over the next 14 days. However, I'm curious as to why you're considering using the fill() method?

You could achieve your goal with the following code snippet:

const getDaysArray = function(year, month, day) {
    let date = new Date(year, month, day);  
    let result = [];
    let i;
    
    for (i = 0; i < 14; i++) {
        result.push(date.getMonth() + '/' + date.getDate());
        date.setDate(date.getDate() + 1);    
    }
    
    return result;
}    

console.log(getDaysArray(2021, 1, 12));

Answer 6

It seems like you're looking to retrieve a list of dates starting from today and spanning over the next 14 days. However, I'm curious as to why you're considering using the fill() method?

You could achieve your goal with the following code snippet:

const getDaysArray = function(year, month, day) {
    let date = new Date(year, month, day);  
    let result = [];
    let i;
    
    for (i = 0; i < 14; i++) {
        result.push(date.getMonth() + '/' + date.getDate());
        date.setDate(date.getDate() + 1);    
    }
    
    return result;
}    

console.log(getDaysArray(2021, 1, 12));

Utilizing JavaScript's functional programming to manipulate dynamic values within an array

Answer №1

Answer №2

Answer №3

Similar questions

An error was encountered: An identifier that was not expected was found within the AJAX call back function

What is the process for assigning one array to another array in programming?

How can I stop the hover event on a series in Highcharts from triggering a hover event on the nearest point (marker)?

Error: Invalid Syntax Detected in React

Comparing JSON Objects in Javascript

Error! Element not found in cloned iframe #2460, promise unhandled

Node JS promise predicaments

An error occurred while trying to update with Webpack Dev Server: [HMR] Update failed due to an issue fetching the update manifest,

Is it possible to issue commands within JavaFX-hosted Javascript?

Dynamically changing the date format within the item-text of v-autocomplete in Vuetify

Setting up a connection between an Express server and a Mongoose database in

What is the best way to exclude the bottom four rows when sorting with MatSort?

The Power of Asynchronous Programming with Node.js and Typescript's Async

Is it possible to convert uncontrolled components from class-based to functional components?

How do I determine the appropriate image type to use?

Tips for utilizing the simple-peer module within a Node.js environment?

Navigate to the previous state or refresh the component for two distinct API calls in ReactJS

Activate audio and trigger notification

Filtering an array of JSONs in Vue.js using a separate array of JSONs

Defining data types for an array of objects in a useState hook