JavaScript: Daily Routine Day 1 to 5
Hello friends, I’m here again. Today I’m sharing with you my first day in my new Javascript series: Daily Routine. If you haven’t read the introduction about why I’m starting this series, I invite you to read my preview article here.
I will be making a summary of what I learned by solving the first 5 exercises of the AoC Challenge 2015.
Adventure of Code
Advent of Code is an Advent calendar of small programming puzzles for a variety of skill sets and skill levels that can be solved in any programming language you like. People use them for interview prep, company training, university coursework, practice problems, a speed contest, or to challenge each other. You don’t need a computer science background to participate — just a little programming knowledge and some problem-solving skills will get you pretty far.
Day 1
I’m solving the exercises for the 2015 event, and on my first day, I received this exercise, which you can see here. To solve this problem after a lot of research on the internet, reading articles, etc. I was introduced to two new concepts for me.
Spread and Map in javascript. The question is what are Spread and Map and how I used both to solve my programming problem? Well, don’t worry, I’ll explain now. Well, let’s go directly to the code. I am leaving the link to my code on my GitHub.
Spread[…]
The JavaScript spread operator (...
) expands an iterable (like an array) into more elements.
In simple terms, we can say that the spread operator breaks an array, it breaks a set of elements and returns element by element. One of the advantages of using the spread is that it simplifies several operations when it comes to working with arrays and HTML collection or other collections possible in JavaScript.
Map()
In simple terms, Map has the functionality to traverse an array, we use it when we need to work element by element of a collection, unlike loops, Map will iterate the entire collection, you don’t stop in the middle, you have to iterate all the elements in the collection.
Note that the input I used in my code is small because it is an example input. In AoC, each exercise comes with a personalized input, and these inputs are normally quite large as in the exercise on day 1, hence the use of these two scattered elements Spread and Map() to help in solving the exercises.
Day 2
On day 2 I learned about Slip(), a method used to split the given string into an array of strings by separating it into substrings using a specified separator provided in the argument.
Here is my code, I use the split()
const boxes = input.split('\n')
: This line uses thesplit
method to split theinput
string into an array of substrings. The delimiter used for splitting is the newline character ('\n'
), so each element in the resulting array corresponds to a line in the originalinput
string.const arrayInput = boxes[i].split('x').map(Number);
: Here, for each box (line), thesplit
the method is used again, but this time it splits the line using the 'x' character as the delimiter. The result is an array of strings representing the length, width, and height of the box. Themap(Number)
part is converting each string element to a number.console.log(arrayInput)
: This line simply logs the array of numbers representing the dimensions of the current box to the console.
So, in summary, the Split() method is used to separate the lines of the input and to extract the dimensions of each box from those lines.
Day 3
In this specific image above I want to show a little about what the input of our AoC exercise might look like, I think you can see how I need to use the String element (``) template so that my editor and the code itself recognize and accepts the countless inputs from the exercise.
Before I start explaining about Set(), let me tell you what a Template String is. Template String is a feature in JavaScript that allows you to embed expressions inside string literals. They are enclosed by backticks (``), not to be confused with single or double quotes. Template strings are convenient because they allow you to interpolate variables and expressions directly into the string without the need for concatenation or complex escaping.
Now that we’ve talked about template string, let’s talk about what Set() is and understand why I used it in my exercise.
Set() is a collection of values where each value must be unique. It means that the same value cannot occur more than once in a Set. Sets are useful when you want to store unique values and quickly check for the existence of a specific value in the collection. They provide methods like add()
, delete()
, has()
, and clear()
for manipulating the set.
In this exercise, we use Set() because the idea is that in each iteration Santa Claus will visit a specific house based on a specific direction.
Day 4
To solve the problem on day 4, after reading and understanding what the problem is talking about, I first needed to understand what an md5 is, how to calculate an md5, and how I can use it to help me solve my problem.
MD5 is a cryptographic hash function algorithm that takes the message as input of any length and changes it into a fixed-length message of 16 bytes. Or MD5 (technically called MD5 Message-Digest Algorithm) is a cryptographic hash function whose main purpose is to verify that a file has been unaltered.
MD5 hashes are 128 bits in length and are normally shown in their 32-digit hexadecimal value equivalent. This is true no matter how large or small the file or text may be.
JavaScript doesn’t have a built-in function to generate MD5 strings by default. We need to use an external library, and blueimp-md5 is probably your best option currently. The blueimp-md5 library is compatible with most projects. You can use it with server-side environments like Node.js, module loaders like RequireJS, or more directly with all web browsers.
Day 5
Something I notice is that with each step taken and exercise performed, the level of difficulty increases, and more new elements emerge to solve the exercises.
Due to the complexity of the exercise, the easiest way to solve it is by using regular expressions. To be honest, this is my first time working with regular expressions and they seem very useful when we are creating different conditions that are using strings.
A regular expression is a sequence of characters that forms a search pattern. When you search for data in a text, you can use this search pattern to describe what you are searching for. A regular expression can be a single character or a more complicated pattern.
The only way to create a regular expression is to understand what the condition is asking for and based on that create a regular expression. This is how I managed to solve the problem on day 5.
Once I finished the first 5 AoC exercises, I gained 10 stars and managed to light the first 5 lines of my Christmas tree, the objective is to light all the lines, so let’s start the journey to the next 5 exercises and so on. See you in the next article.
Recommendation
If you don’t want to configure your work environment, you can create your code here: Replit
For anyone who wants to try regular expressions and see how they work, I suggest using this website: Regexr
Learn more about md5 in npm: npm
Visit my GitHub here, my portfolio here, and my LinkedIn here.