Discover distinct values within an array based on the data

Question

Discover distinct values within an array based on the data

I have an array that contains the data of users who joined in the last seven days from the current date. For example:

users=['19 Dec', '21 Dec', '21 Dec']

This array shows that three users joined in the last 7 days. I am attempting to identify the unique occurrences using this function. `

 let occurrences = users.reduce(function (acc, curr) {
              return acc[curr] ? ++acc[curr] : (acc[curr] = 1), acc;
            }, {});

`

The returned object consists of the following key-value pairs: {19 Dec: 1, 21 Dec: 2} My goal is to complete the missing values in the object with 0 and their respective dates. Therefore, the final output should be:

{19 Dec: 1, 20 Dec: 0, 21 Dec: 2, 22 Dec: 0, 23 Dec: 0, 24 Dec: 0, 25 Dec: 0}

Could someone please assist me in resolving this issue?

I anticipate filling the missing values in the object with 0 along with their corresponding dates. As a result, the final output should look like this:

{19 Dec: 1, 20 Dec: 0, 21 Dec: 2, 22 Dec: 0, 23 Dec: 0, 24 Dec: 0, 25 Dec: 0}

javascript arrays angular typescript

Answer 1

Answer №1

Maybe you can try something similar to this approach. I've made some tweaks to the code inspired by this solution on Stack Overflow. The formatting was adjusted based on another Stack Overflow answer.

To start off, let's create an array that includes the past 7 days.

Date.prototype.addDays = function(days) {
    var date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
}

function getDates(startDate, stopDate) {
    var dateArray = [];
    var currentDate = startDate;
    while (currentDate <= stopDate) {
        var calendarDay = currentDate.getDate();
        var monthName = new Intl.DateTimeFormat('en-US', options).format(currentDate);
        dateArray.push(calendarDay + " " + monthName);
        currentDate = currentDate.addDays(1);
    }
    return dateArray;
}

var options = { month: 'short' };
var end = new Date();
var start = end.addDays(-7);

var dateArray = getDates(start,end);

Now, let's assume you have a JSON object with dates and corresponding user counts as values.

let occurences = {
    "19 Dec": 1,
    "21 Dec": 2
};

We'll create a copy of this object for manipulation purposes. This step is optional, but it provides more flexibility.

var copyOcc = occurences;

Next, we'll iterate through our dateArray and update the user counts based on matching dates in occurences.

for(var i = 0; i < dateArray.length; i++) {
    // Add missing keys to the copy
    if(!copyOcc.hasOwnProperty(dateArray[i])) {
        copyOcc[dateArray[i]] = 0;
    }
}

console.log(copyOcc);

The resulting output will look like:

{
  18 Dec: 0,
  19 Dec: 1,
  20 Dec: 0,
  21 Dec: 2,
  22 Dec: 0,
  23 Dec: 0,
  24 Dec: 0,
  25 Dec: 0
}

Feel free to explore the complete script on JSFiddle.

Answer 2

Maybe you can try something similar to this approach. I've made some tweaks to the code inspired by this solution on Stack Overflow. The formatting was adjusted based on another Stack Overflow answer.

To start off, let's create an array that includes the past 7 days.

Date.prototype.addDays = function(days) {
    var date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
}

function getDates(startDate, stopDate) {
    var dateArray = [];
    var currentDate = startDate;
    while (currentDate <= stopDate) {
        var calendarDay = currentDate.getDate();
        var monthName = new Intl.DateTimeFormat('en-US', options).format(currentDate);
        dateArray.push(calendarDay + " " + monthName);
        currentDate = currentDate.addDays(1);
    }
    return dateArray;
}

var options = { month: 'short' };
var end = new Date();
var start = end.addDays(-7);

var dateArray = getDates(start,end);

Now, let's assume you have a JSON object with dates and corresponding user counts as values.

let occurences = {
    "19 Dec": 1,
    "21 Dec": 2
};

We'll create a copy of this object for manipulation purposes. This step is optional, but it provides more flexibility.

var copyOcc = occurences;

Next, we'll iterate through our dateArray and update the user counts based on matching dates in occurences.

for(var i = 0; i < dateArray.length; i++) {
    // Add missing keys to the copy
    if(!copyOcc.hasOwnProperty(dateArray[i])) {
        copyOcc[dateArray[i]] = 0;
    }
}

console.log(copyOcc);

The resulting output will look like:

{
  18 Dec: 0,
  19 Dec: 1,
  20 Dec: 0,
  21 Dec: 2,
  22 Dec: 0,
  23 Dec: 0,
  24 Dec: 0,
  25 Dec: 0
}

Feel free to explore the complete script on JSFiddle.

Answer 3

Answer №2

This is an alternative implementation in pure JavaScript:

const usersList = ['19 Dec', '21 Dec', '21 Dec']
const monthsAbbreviation = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

// Fetch previous days' data, defaulting to 7 days
function getPreviousDaysData(numOfDays = 7) {
  const dataObj = {};
  for (let i = 0; i < numOfDays; i++) {
    const currentDate = new Date();
    currentDate.setDate(currentDate.getDate() - i);
    dataObj[formatDate(currentDate)] = 0;
  }
  return dataObj;
}

// Format the date
function formatDate(date) {
  return `${date.getDate()} ${monthsAbbreviation[date.getMonth()]}`
}

// Create object for previous 7 days
const previousDaysData = getPreviousDaysData(7);

// Calculate occurrences
const occurrences = usersList.reduce(function (accumulator, current) {
  accumulator[current] ? ++accumulator[current] : (accumulator[current] = 1);
  return accumulator;
}, Object.assign({}, previousDaysData));

// Log the occurrences to console
console.log(occurrences)

Answer 4

This is an alternative implementation in pure JavaScript:

const usersList = ['19 Dec', '21 Dec', '21 Dec']
const monthsAbbreviation = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

// Fetch previous days' data, defaulting to 7 days
function getPreviousDaysData(numOfDays = 7) {
  const dataObj = {};
  for (let i = 0; i < numOfDays; i++) {
    const currentDate = new Date();
    currentDate.setDate(currentDate.getDate() - i);
    dataObj[formatDate(currentDate)] = 0;
  }
  return dataObj;
}

// Format the date
function formatDate(date) {
  return `${date.getDate()} ${monthsAbbreviation[date.getMonth()]}`
}

// Create object for previous 7 days
const previousDaysData = getPreviousDaysData(7);

// Calculate occurrences
const occurrences = usersList.reduce(function (accumulator, current) {
  accumulator[current] ? ++accumulator[current] : (accumulator[current] = 1);
  return accumulator;
}, Object.assign({}, previousDaysData));

// Log the occurrences to console
console.log(occurrences)

Answer 5

Answer №3

My recommendation is to implement the following solution using typescript:

First, create an array that stores the dates of the last 7 days in the format found in the users array.
Next, iterate through these 7 dates using the map operator and apply the filter method to determine the number of user registrations on each day.
The function getDailyRegistrations() will output an object with the dates as keys and the corresponding number of user registrations as values.

months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
          'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
users = ['19 Dec', '21 Dec', '21 Dec'];


getDailyRegistrations(numberOfDays: number = 7): any {
    let occurrences: any = {};
    this.getLastXDates(numberOfDays)
        .map(d => this.formatDate(d))
        .forEach((d: string) => {
            occurrences[d] = this.users.filter(u => u === d).length;
    });
    return occurrences;
}


/* Helper methods */

private getLastXDates(numbOfDays: number): Date[] {
    return Array.from(Array(numbOfDays).keys()).reverse().map(i => {
        const d = new Date();
        d.setDate(d.getDate() - i);
        return d;
    });
}

private formatDate(d: Date): string {
    const day = d.getDate();
    const month = this.months[d.getMonth()];
    return `${day} ${month}`;
}

Answer 6

My recommendation is to implement the following solution using typescript:

First, create an array that stores the dates of the last 7 days in the format found in the users array.
Next, iterate through these 7 dates using the map operator and apply the filter method to determine the number of user registrations on each day.
The function getDailyRegistrations() will output an object with the dates as keys and the corresponding number of user registrations as values.

months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
          'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
users = ['19 Dec', '21 Dec', '21 Dec'];


getDailyRegistrations(numberOfDays: number = 7): any {
    let occurrences: any = {};
    this.getLastXDates(numberOfDays)
        .map(d => this.formatDate(d))
        .forEach((d: string) => {
            occurrences[d] = this.users.filter(u => u === d).length;
    });
    return occurrences;
}


/* Helper methods */

private getLastXDates(numbOfDays: number): Date[] {
    return Array.from(Array(numbOfDays).keys()).reverse().map(i => {
        const d = new Date();
        d.setDate(d.getDate() - i);
        return d;
    });
}

private formatDate(d: Date): string {
    const day = d.getDate();
    const month = this.months[d.getMonth()];
    return `${day} ${month}`;
}

Discover distinct values within an array based on the data

Answer №1

Answer №2

Answer №3

Similar questions

Design divs that automatically adjust in size based on mouse-over activity

Troubleshooting Issue with React Function's Conditional Component Rendering

The component data fails to reflect the updated value following a status change due to not properly retrieving the new result from the POST function

Python script utilizing Selenium to load only JavaScript content and excluding full HTML rendering

Encountering an error stating "unable to access properties of undefined (reading 'redirectUri')"

What measures can I take to protect the use of React components that may not be present?

Resolving route data in Angular 2 and above

Enhance your automation with the powerful combination of Java,

Resize all types of content using a "zooming" container

Trouble with importing React JSX from a separate file when working with Typescript

Testing the mirkoORM entities at a unit level

The Socket.io application is facing deployment issues on the Heroku platform

What is the most effective method for implementing multiple textures in three.js?

Sending AJAX information to multiple pages

What is the best way to dynamically add getJSON's data to a div whenever the loadmore button is clicked?

Can someone provide an explanation for this JavaScript function: What is the purpose of $this = $(this)

Using Javascript to convert an SVG file into DOM elements

Tips for retrieving the posted object in angularJS

Real-time data not instantly stored using socket.io

Fixing blurry text on canvas caused by Arbor.js mouse event issues