Design comparison
Solution retrospective
What do you think about the code?
This project its quite challenging, especially to formulate the calculation years, month, and numbers. but in the end, googling is the best option ahhahaha.
I also try to implement (DRY) by create a function show an error,
I learned a lot from this project
Community feedback
- @RichusDPosted about 1 year ago
This was a very tricky project and well done for completing it! I noticed that when I used your app with the date I put in (13 December 1990) the result was two years and 1 day higher than it should be, and I think I found a couple issues in your calcAge function:
Year Value Where the
currentMonth
value is less than theinputMonth
, currently you subtract 1 frominputYear
. You then subtractinputMonth
fromcurrentMonth
and add 12, which would prevent you getting a negative number as a result. The issue is that in this instance you should add 1 to theinputYear
, not subtract one. When you add the 12 months, you're essentially adding 12 months tocurrentMonth
, which means you're kind of pretending as if today's date is 10/20/23 instead of 10/08/23 so you could subtract from it, and 10/20/23 would be in the future. This corrects the issue with the result being 2 years over. Admittedly it might need some more testing to make sure it works in more scenarios.Month values You generate the values for
currentMonth
andinputMonth
differently, which causes some errors. ForinputMonth
, you take the value in the months input box and cast it as a number, so December would be 12, as you would expect it to be. However forcurrentMonth
, you use the.getMonth()
method, which returns an index for the month of theDate
object it's used on. This means that August would return a 7, instead of an 8. As myinputDay
was larger thancurrentDay
, yourcalcAge
function subtracted 1 frominputDay
so the result was still correct, but if I put myinputDate
to 9 instead of 13, the result would be inaccurate by -1 month. Weirdly.getMonth()
is the onlyDate
method that returns an index, so this issue is very specific to this particular error.There's also an issue that pops up for dates that are less than 1 month away, in that if I put 11/07/23 in, it says that that date is 1 Year, 1 Month and 30 days away - it's over by a month. I believe this is caused by the same issue that caused the Year Value issue (as you add 31 days where
currentDay
is less thaninputDay
but subtract 1 frominputMonth
) but there may also be some complexities arising from the different ways thatcurrentMonth
andinputMonth
are generated.Minor refactoring You can also refactor your code a bit by changing
let day = document.getElementById('inputDay')
intolet day = document.getElementById('inputDay').value
and then using that in place of where you useinputDay
. You could also do the same for month and year.There's also some minor inaccuracies I'm sure you're aware of which are due to the varying amount of days in a month, but these are quite tricky to fix without a package. I think you did a great job overall and most importantly - the frontend looks great!
Marked as helpful0@digiT000Posted about 1 year ago@RichusD
Thank you so much @RichusD for your feedback. Its really2 quite tough project for me especially for the formula. I will try to adjust based on your feedback and try understand it.
For the refactoring code I already try to use
.value
for every input, but when i execute the function the value from the input is not return anything. But i'' try it againThank you so much for your feedback, really mean a lot for my learning journey
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord