"Primitive" and "reference" values in JavaScript, a concept most developers skip as it seems to be too theoretical, actually became quite important when I was learning React. If you don't know about this, let me quickly summarize the concept.
In JS, there are two types of data/values that can be stored in a variable, primitive value and reference value.
Q1. Which values are primitive and which ones are references?
- Any number, string, boolean, undefined, null, or symbol is a primitive value.
- Arrays, Objects, and Functions are reference values.
Q2. Where does a primitive value gets stored, and where does a reference value gets stored?
- When you declare a variable having a primitive value, the JS engine allocates the memory and store the value on the stack.
- On the other hand, when you declare a variable having a reference value, the JS engine allocates the memory and store the value on the heap.
Q3. On calling these two types of variables, what do we get in return?
- When you access a primitive value, you get the actual value of it. That is why when we assign a variable that stores a primitive value to another, the value stored in the variable gets copied into the new variable. Now if you make a change in any of the variables, the other one doesn't get affected.
- When you access a reference value, you get the reference/location of the memory of it. That is why when we assign a variable that stores a reference value to another, the location of the value is passed to the other variable. Now if you make a change in any of the variables, **the other one also gets affected **because they are pointing to the same value stored in the heap memory.
Want to read a more clear explanation with examples? You can check out an amazing article by Tyler McGinnis on the same.
Happy coding :)
Top comments (0)