Do you know Javascript? The language we all love has some weird and sometimes unexpected behaviors. It is a good idea to know them, mostly to avoid unexpected bugs and unpleasant surprises. Do you want an example? const a = 0.1;
const b = 0.2;
const c = 0.3;

console.log(a + b === c); // false The output here is . The sum is not equal to . false 0.1 + 0.2 0.3 Why does this happen? It's because of how floating point numbers are represented in JavaScript. One more cool example: "2" + "3" === "23"; // true This was expected, right? We're concatenating two strings. But what if we replace with ? + * "2" * "3" === 6; // true In this case, the operator tried to convert the two strings in numbers, that's why we got . * 6 The minigames I've collected 12 situations like these and I will walk you through them in this video. I will also use the node REPL to further expand on some of them when the output is particularly weird. https://youtu.be/8gGuu9c9miY?embedable=true Not a video guy? Here are all 12 minigames: 1.  "B" + "a" + +"🟡" + "a"
2.  0.1 + 0.2 === 0.3
3.  "2" + "3"
4.  "2" * "3"
5.  NaN === NaN
6.  Array(3).join("Subscribe")
7.  "hello".split("").reverse().join("")
8.  "hello".split().reverse().join("")
9.  [1, 2, 3, 4].length
10. [ , , , ].length
11. typeof 42
12. typeof typeof 42 Wait. Think about those challenges and try to guess the answers. Write them down. Ok, now you can keep scrolling and see the solutions! "B" + "a" + +"🟡" + "a" => BaNaNa In this expression, +"🟡" is a unary plus operator followed by the string "a". The + operator tries to convert the string to a number. Since "a" cannot be converted to a number, it returns NaN. When you concatenate "B", "a", NaN, and "a", it results in "BaNaNa". 2. 0.1 + 0.2 === 0.3 => false As explained above, due to floating-point rounding errors, 0.1 + 0.2 does not equal 0.3. Therefore, 0.1 + 0.2 === 0.3 returns false. 3. "2" + "3" => 23 When you use the + operator on two strings, it concatenates them together, resulting in "23". 4. "2" * "3" => 6 When the operator is used with two strings, JavaScript will try to convert them to numbers first. Since both "2" and "3" can be converted to numbers, JavaScript will convert them and perform the multiplication, resulting in an output of 6. * 5. NaN === NaN => false NaN is a special value in JavaScript that represents "Not a Number". NaN is not equal to any value, including itself. Therefore, NaN === NaN returns false. 6. Array(3).join("Subscribe") => "SubscribeSubscribe" The string “Subscribe” is added in between the elements, which are empty. Hence, between 3 elements there are two slots. 7. "hello".split("").reverse().join("") => "olleh" This expression splits the string "hello" into an array of characters using the split method. Then, it reverses the order of the array using the reverse method. Finally, it joins the reversed array back into a string using the join method, resulting in "olleh". 8. "hello".split().reverse().join("") => "hello" The split method expects a separator as an argument. When no separator is provided, it defaults to undefined, and the string is not split into an array. Therefore, the reverse and join methods cannot be applied to the string. 9. [1, 2, 3, 4].length => 4 This function creates an array with four elements ([1, 2, 3, 4]) and returns its length, which is 4. 10. [ , , , ].length => 3 This time we create an array with three empty items ([, , ,]). When an array is created with empty items like this, JavaScript sets the length of the array to the number of items specified. In this case, the array has a length of 3. 11. typeof 42 => 'number' The typeof operator returns the type of the operand. Since 42 is a number, it returns "number". 12. typeof typeof 42 typeof 42 returns the string "number" as seen in the previous game. Therefore, typeof applied to the string "number" returns… the string "string"! And this was the last one! I hope you enjoyed it and maybe even learned something new :D Feel free to write a comment with how many you got right and what you didn’t guess correct. See you soon! Also Published Here

Why I Quit My Full Stack Web Developer Job

What the FORK Are You Doing to That Repository?!

Enjoy my content on YouTube!

Read My Stories

Too Long; Didn't Read

Make resilience your competitive advantage

Take These 12 Quick Challenges to Find Out if You Know Javascript

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

The Pros and Cons of Smart Working: My Experience

3 Less-Known NFT Games You Can Play Right Now

3 Ways Gamification in Social Media Can Increase User Engagement

5 Best Fitness Games for Your New Years Resolution

Gamification: A New Era in Workplace Experiences

The Pros and Cons of Smart Working: My Experience

3 Less-Known NFT Games You Can Play Right Now

3 Ways Gamification in Social Media Can Increase User Engagement

5 Best Fitness Games for Your New Years Resolution

Gamification: A New Era in Workplace Experiences

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps