Coding through the Advent season
I had the fortune of working through the Scrimba JavaScriptmas challenge this year and thought I could dedicate my first Dev.to post to my solutions as well as what I learned along the way!
The challenge is drawing to a close, and I'm already anticipating what cool things will be in next years challenge
Pretty simple layout here: each day is listed out below along with the link to my solution and any notes I had from the challenge. Leave a comment if you learned something or have insight on how I could improve my solutions!
tldr; If you're just perusing my favs are Days 1, 6, 7, 8, 15.
AND I am wondering if you have better solutions for Days 9, 11, 21. Comment if you do!
Day 1 - Candies
- Link to solution
- For absolutely no reason at all I chose to use recursion for this solution. Technically I altered the original function so I could pass in the running count, but hey, recursion needs what recursion needs what recursion needs .....
Day 2 - Deposit Profit
- Link to solution
- Simple
forloop here, with a bit of compounding percentage math.
Day 3 - Chunky Monkey
- Link to solution
- I became more familiar with how the
slice()method worked on this one. Particularly that the second argument is not the amount of items to remove, but where to stop.
Day 4 - Century From Year
- Link to solution
- Went for a sweeeet one-liner here using
Math.floor()and the modulo operator. Learned a bit more on whatMath.floor()returns when the argument passed is a decimal.
Day 5 - Reverse A String
- Link to solution
- Nothing fancy here, but it was good practice with some common string / array methods and how to move between the two types.
Day 6 - Sort By Length
- Link to solution
- Did you know you can pass a function to the
Array.prototype.sort()method?? You can, and it will make you feel like you have super-powers...
Day 7 - Count Vowel Consonant
- Fair warning, I got a bit flashy on this one... a RegExp && reducer in the same solution?? 🤓 This was a fun one to work through. I've used reducers in React before, but never in the wild!
Day 8 - Rolling Dice
- Link to solution
-
This was a challenge... not just JS but some CSS as well. I used data attributes, multiple
Mathmethods, and some DOM manipulation. Things like this are great practice for real world scenarios.
Day 9 - Sum Odd Fibonacci Numbers
- Link to solution
- This one took a lot of finagling on the logic to get right. Having to generate a Fibonacci sequence in the function, determine if the current step was an odd number, and if so add it to a running total...
Day 10 - Adjacent Elements Product
- Link to solution
- Somewhat simple logic here, but another great example of making yourself think of a problem the way a computer does. Step by step until the solution is found, then quick --> return!!!
Day 11 - Avoid Obstacles
- Link to solution
- I got to learn about the
every()method on this one (never used it before). It was also fun to figure out how to make sure the loop ran until it checked up to the value of the largest entry and didn't just run for the length of the array.
Day 12 - Valid Time
- Link to solution
- Used our old friend RegExp on this one again! Not for the official solution, but for the format check I added 😁.
Day 13 - Extract Each Kth
Uh-Oh! Truth time ... In reviewing these for the blog post I found my solution for this one was correct, but in the wrong way 😅; meaning I got the correct solution but not what the problem was asking. Let me just clean it up real quick ...
- Alrighty, all fixed! I had originally been testing the item at the current position in the array to see if it was a multiple of the index provided instead of checking the position. This worked in the original test case as the items needing removed were also multiples of the index provided.
Day 14 - Maximal Adjacent Difference
- Link to soultion
-
Math.abs()was the hero on this one. I had no idea Math went to the gym! Nice abs Math... very helpful.
Day 15 - JavaScript Carousel
- Link to solution
- Another great real-world challenge! I added some 'flare' on this one by using
IntersectionObserverto work the little dots under the slider, indicating which item in the carousel you are on.IntersectionObserveris super handy. Always there, always watching ... 😳
Day 16 - Insert Dashes
- Link to solution
- Another chance to
split()things apart andjoin()them back together. The challenge here was really that you can't let a dash land after a word boundary ... that's the spaces space.
Day 17 - Different Symbols Naive
- Link to solution
- I started to add fun things like 'null checks' and force the input to fit the type needed on this one. For the actual solution
Set()was the shining star. Gotta make sure each item is one of a kind!
Day 18 - Array Previous Less
Ignore the extra tests again, I just added them to look cool 🤓
- I opted to
reverse(), then check, thenshift()for this one. I was familiar withshift()before hand, but I have never used it before in my coding, so another opportunity to learn!
Day 19 - Alphabet Subsequence
I hope you're enjoying my terrible grammar and wordplay in the catches and var names. If not, I am so sorry. I'll go sit in the corner now...
- This JavaScriptmas challenge has definitely taught me a lot about array and string methods! Example: on this one I learned that
sort()changes the original array and returns a reference. That became clear to me as I was working through the solution for this one.
Day 20 - Domain Type
- Link to solution
- I love switch statements ... probably too much, so this solution got one. Thanks to the previous challenges I was becoming pretty comfortable with array methods at this point so the solution wasn't too difficult.
Day 21 - Sum Of 2
- Link to solution
- Thought about this one for a bit, and in my mind there was no way around having to add each number in both arrays to get a solution. The question was do I add them all and then check if the value was there or check as I go? 🤔 I went with option number B.
- My solution included nested for loops, but I am curious if there is a faster way. ? Drop a comment if you have a different approach!
Day 22 - Extract Matrix Column
- Link to solution
- This was an example of what makes the JavaScriptmas challenge so great. It's not about solving exceedingly difficult problems, for me it's more about being able to quickly identify how you might solve the problem and then start implementing that line of thought. Get out of your head, stop overthinking, use your smarts to get a base idea and then run with it!
Day 23 - Social Media Input
- Link to solution
- Tracking user input and adjusting DOM elements based on it is a very valuable skill, and that's exactly the practice this exercise gives. I threw in a few extra CSS animations for fun, but tried to keep the JS focused on what was needed for the solution.
Day 24 - Test Your Agility
- Link to solution
- Whoa, this one made me stop and think hard. It was a blast learning how to work with async await in order to keep / stop a running timer. Before this I only used async functions to initiate a fetch! Cool use case...
Well,
That's it for this year's JavaScriptmas! Learned a lot of cool things over the course of completing the challenges. Can't wait to see what Scrimba has for us next year!
Top comments (1)
Top write-up, ZumDeWald! I believe you put in all the necessary work and got the most you could out of #JavaScriptmas. That is what we love to see!
Sorry about day 13, that tripped a few of us up at first!