Cover photo by Faris Mohammed
Hello, coders! 💻
In this second post aimed at beginners we'll continue manipulating arrays because:
- arrays are fun
- you will have to deal with arrays A LOT in your career so you might as well feel comfortable working with them
Context
You're given a list of purchases customers have made over the past few months. Given the quantity it's fair to say it's not a very popular shop...
const purchases = [
{item: 'socks', amount: 25.98, date: '2022-05-07 09:31:29'},
{item: 'jacket', amount: 145.98, date: '2022-05-17 17:01:09'},
{item: 'cap', amount: 12.99, date: '2022-05-17 17:03:12'},
{item: 'socks', amount: 43.99, date: '2022-06-11 18:24:16'},
{item: 'cap', amount: 13.99, date: '2022-06-11 18:24:16'},
{item: 'jacket', amount: 132.99, date: '2022-06-21 11:21:35'},
{item: 'socks', amount: 13.99, date: '2022-06-23 09:43:28'},
{item: 'socks', amount: 12.99, date: '2022-07-01 13:14:56'},
{item: 'jacket', amount: 132.99, date: '2022-07-03 15:24:24'},
{item: 'cap', amount: 32.99, date: '2022-07-05 11:14:15'},
{item: 'socks', amount: 13.99, date: '2022-07-07 11:14:15'},
];
Exercise 1
Your task is to compute the total amount of purchases per month and store that in an object named monthlyRevenue
.
Expected object
⚠️ Amounts have 2 decimal places.
let monthlyRevenue = {
'2022-05': 184.95,
'2022-06': 204.96,
'2022-07': 192.96
}
Solution to exercise 1
👇 Let's see how we can break down what we need to do. Sounds good. Let's code! ⌨️ Easy. Let's try the following: which outputs: All good! Onto step 3: sum of amounts. Now that we have the year/month part we can store amounts in Let's see what happens when we innocently add each outputs: Ouch! should do the trick! Let's update our code: and see the output: Hooray! 🚀 Wait, Why so many decimal places?! It has to do with floating points. It's a topic in its own right and I won't go into details here. What I can tell you though, is that there we're not done yet! Looking back at the exercise's description I see a ⚠️ sign to let us know numbers must have 2 decimal places. And that's step 4 which I mentioned earlier. ^^ Let's round things after the loop that populates which outputs Almost there! What does the output look like? 🚀 Now we're talking. It outputs exactly what was asked. Here's all the code: 😅 That was a long ass guide! Too long? Too detailed? Let me know in the comments! 💬
Click for a step by step guide
purchases
monthlyRevenue
for the date found in our previous step.
// purchases omitted for readability
let monthlyRevenue = {}
// first step: loop!
purchases.forEach(function (purchase) {
// do something
})
Now, how do we get the year/month part from each purchase.date
?
Well, purchase.date
is a string and the 7 first characters are year and month which is what we need.
So how about using substring
?
purchase.date.substring(0, 7)
// purchases omitted for readability
let monthlyRevenue = {}
// first step: loop!
purchases.forEach(function (purchase) {
// second step: year/month part
const purchaseDate = purchase.date.substring(0, 7);
console.log(purchaseDate);
})
2022-05
2022-05
2022-05
2022-06
2022-06
2022-06
2022-06
2022-07
2022-07
2022-07
2022-07
monthlyRevenue[purchaseDate]
.purchase.amount
to monthlyRevenue[purchaseDate]
to get a sum.
// purchases omitted for readability
let monthlyRevenue = {}
// first step: loop!
purchases.forEach(function (purchase) {
// second step: year/month part
const purchaseDate = purchase.date.substring(0, 7);
// step 3: sum
monthlyRevenue[purchaseDate] += purchase.amount;
})
console.log(monthlyRevenue);
Object {
"2022-05": NaN,
"2022-06": NaN,
"2022-07": NaN
}
NaN
? 🍞?
It means Not a Number
and is due to the fact that we're trying to add a number to monthlyRevenue[purchaseDate]
which is initially undefined
.
We need to make sure it's 0
before adding anything to it.
monthlyRevenue[purchaseDate] = purchase.amount + (monthlyRevenue[purchaseDate] || 0);
||
return the rightmost element if the first one is falsy
.
So when we first access monthlyRevenue[purchaseDate]
it will return undefined
which is falsy
so ||
returns 0
.
From now on monthlyRevenue[purchaseDate]
will no longer be falsy
.
// purchases omitted for readability
let monthlyRevenue = {}
// first step: loop!
purchases.forEach(function (purchase) {
// second step: year/month part
const purchaseDate = purchase.date.substring(0, 7);
// step 3: sum
monthlyRevenue[purchaseDate] = purchase.amount + (monthlyRevenue[purchaseDate] || 0);
})
console.log(monthlyRevenue);
Object {
"2022-05": 184.95,
"2022-06": 204.96000000000004,
"2022-07": 192.96000000000004
}
monthlyRevenue
. We'll use toFixed
:
// step 4: rounding numbers
for (let yearMonth in monthlyRevenue) {
monthlyRevenue[yearMonth] = monthlyRevenue[yearMonth].toFixed(2);
}
console.log(monthlyRevenue);
Object {
"2022-05": "184.95",
"2022-06": "204.96",
"2022-07": "192.96"
}
toFixed
returns a string and we want a number so we call Number
to parse strings and voilà:
// step 4: rounding numbers
for (let yearMonth in monthlyRevenue) {
monthlyRevenue[yearMonth] = Number(monthlyRevenue[yearMonth].toFixed(2));
}
console.log(monthlyRevenue);
Object {
"2022-05": 184.95,
"2022-06": 204.96,
"2022-07": 192.96
}
Putting it all together
const purchases = [
{item: 'socks', amount: 25.98, date: '2022-05-07 09:31:29'},
{item: 'jacket', amount: 145.98, date: '2022-05-17 17:01:09'},
{item: 'cap', amount: 12.99, date: '2022-05-17 17:03:12'},
{item: 'socks', amount: 43.99, date: '2022-06-11 18:24:16'},
{item: 'cap', amount: 13.99, date: '2022-06-11 18:24:16'},
{item: 'jacket', amount: 132.99, date: '2022-06-21 11:21:35'},
{item: 'socks', amount: 13.99, date: '2022-06-23 09:43:28'},
{item: 'socks', amount: 12.99, date: '2022-07-01 13:14:56'},
{item: 'jacket', amount: 132.99, date: '2022-07-03 15:24:24'},
{item: 'cap', amount: 32.99, date: '2022-07-05 11:14:15'},
{item: 'socks', amount: 13.99, date: '2022-07-07 11:14:15'},
];
let monthlyRevenue = {}
// first step: loop!
purchases.forEach(function (purchase) {
// second step: year/month part
const purchaseDate = purchase.date.substring(0, 7);
// step 3: sum
monthlyRevenue[purchaseDate] = purchase.amount + (monthlyRevenue[purchaseDate] || 0);
})
// step 4: rounding numbers
for (let yearMonth in monthlyRevenue) {
monthlyRevenue[yearMonth] = Number(monthlyRevenue[yearMonth].toFixed(2));
}
console.log(monthlyRevenue);
Homework 🏡
Now that arrays and objects have no secrets for you, here's your assignment.
Create a list of best and worst selling items of each month.
Best and worst are defined by the revenue they generated.
Expected result:
let topFlops = {
"2022-05": {
top: 'jacket',
flop: 'cap'
},
"2022-06": {
top: 'jacket',
flop: 'cap'
},
"2022-07": {
top: 'jacket',
flop: 'socks'
}
}
Happy coding! 💻
Top comments (0)