DEV Community

Cover image for 🤯 3 Weird things that are cool to know about Javascript and Typescript, PART I
Matheus Mello
Matheus Mello

Posted on

🤯 3 Weird things that are cool to know about Javascript and Typescript, PART I

Zup 🤖

Currently, I've been talking with some friends about these amazing tools and I figured it out that we didn't know a bunch of things that can help you understand a little bit better the Javascript and his secrets 🥷.

These are some of them:

Array is an object 🥲:

# if you are trying to check if an array has the type of 'Array'
# my friend, you are doing wrong

console.log(typeof "something") # "string"
console.log(typeof {}) # "object"
console.log(typeof []) # "object"
Enter fullscreen mode Exit fullscreen mode

You might ask, why this is happening? Am I crazy? No, you are not or maybe you are but this is not the point, the reason why this is happening is because the structure of the data is a list or an array but the object that hold all the logic and methods is an object, so imagine that you want to access the property x in the object obj:

const obj = { x: 'Hello' }

console.log(obj.x) # 'Hello'
Enter fullscreen mode Exit fullscreen mode

Now imagine that you want to access a property called length in the array:

# This is what is happening behind the scenes

const arr = [2]
console.log(arr.length) # 1
Enter fullscreen mode Exit fullscreen mode

Did you see the differences between accessing an object and the property length? Exactly, this is the reason why they used the object structure to define an array.

Difference between any and unknown 🥸:

Similar to any, any value can be assigned to unknown; however, unlike any, you cannot access or call/create any properties on values of the type unknown. Additionally, only unknown or any can be used to assign values of type unknown.

type MyCoolProps {
   newOnboardingFlow: any;
}

...

try{...}
catch(error: unknown){...}
Enter fullscreen mode Exit fullscreen mode

setTimeout will be delayed even if the time is zero:

The global setTimeout()method sets a timer which executes a function or specified piece of code once the timer expires. It is a really good way to render things after x milliseconds.

setTimeout(() => console.log('Hello dev.to', 1000))

# After 1 second
# Hello dev.to
Enter fullscreen mode Exit fullscreen mode

But this definition is not true if you are setting the milliseconds as zero:

setTimeout(() => console.log('Hello dev.to', 0))
console.log("Bye")

# outputs:
# Bye
# Hello dev.to
Enter fullscreen mode Exit fullscreen mode

Why this weird magic is happening you might ask?! The reason is because when you set the timer as zero it will run the setTimeout in the next iteration, it means that it will check the stack literally after running the second console.log.

By next iteration I mean: If this parameter is omitted, a value of 0 is used, meaning execute "immediately", or more accurately, the next event cycle.

💰 These are my 2 cents for today.

👋Help me achieving 500 followers on LinkedIn where I share some of my thoughts.

👇 Let me know what you think about this topic in the comments section.

👉 Follow me to know more about it.

✅ This is my medium and my personal website where I write all startups, tech and entrepreneurship of topics.

Top comments (0)