DEV Community

ZumDeWald

Posted on • Updated on

My JavaScriptmas Journey

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

• 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

• Simple `for` loop here, with a bit of compounding percentage math.

Day 3 - Chunky Monkey

• 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

• Went for a sweeeet one-liner here using `Math.floor()` and the modulo operator. Learned a bit more on what `Math.floor()` returns when the argument passed is a decimal.

Day 5 - Reverse A String

• 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

• 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

• This was a challenge... not just JS but some CSS as well. I used data attributes, multiple `Math` methods, and some DOM manipulation. Things like this are great practice for real world scenarios.

Day 9 - Sum Odd Fibonacci Numbers

• 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

• 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

• 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

• 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

• `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

• Another great real-world challenge! I added some 'flare' on this one by using `IntersectionObserver` to work the little dots under the slider, indicating which item in the carousel you are on. `IntersectionObserver` is super handy. Always there, always watching ... 😳

Day 16 - Insert Dashes

• Another chance to `split()` things apart and `join()` 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

• 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, then `shift()` for this one. I was familiar with `shift()` 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

• 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

• 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

• 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

• 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

• 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!