Home > Web Front-end > JS Tutorial > Different Data types in JavaScript.

Different Data types in JavaScript.

Barbara Streisand
Release: 2025-01-15 06:36:46
Original
264 people have browsed it

Different Data types in JavaScript.

We have different data types in JavaScript.

  • Primitive types: string, number, boolean, undefined, null, symbol, and bigint.

  • Reference types: object, function, and array.


Primitive Types

Primitive types are the most basic data types in JavaScript. They're immutable. This means that once a primitive value is created, it can't be changed. Don't confuse this with reassigning a variable. Reassigning a variable is not the same as changing the value of a primitive type.

Reassigning Is Okay ??

let str = "hello";
str = "Hello"; // str -> "Hello"
Copy after login
Copy after login

In this example, we're reassigning the variable str to a new value. This is perfectly fine.

Same Values Are Same Values in Memory

let str1 = "hello";
let str2 = "hello";
Copy after login

Here we have two variables, str1 and str2, that have the same value. In JavaScript, if two primitive values are the same, they're equal. They're equal because under the hood, both variables point to the same memory location.

Same strings aren't re-created in memory. They're stored in memory only once. JavaScript engineers use a technique called string interning to optimize memory usage. This technique is also used for numbers.

Primitive Types Are Immutable

let str = "hello";
str[0] = "H"; // str -> "hello"
Copy after login

You cannot change a string once it's created. In this example, we're trying to change the first character of the string str to "H." This won't work. The string str will remain the same. Primitive types are immutable.

If you need to create a new string, you can do so explicitly:

let newStr = "H" + str.slice(1); // newStr -> "Hello"
Copy after login

Reference Types

Reference types are mutable. This means that you can change the value of a reference type. They're called reference types to highlight that they're stored as references in memory. While strings are stored as references too, they're immutable and use the interning technique to avoid re-creating identical values in memory.

Objects Are Newly Created in Memory

let obj1 = { name: "John" };
let obj2 = { name: "John" };
Copy after login

Here, obj1 and obj2 are two different objects. They're stored in different memory locations. Even though they have the same properties and values, they're not equal because objects are compared by reference, not by value.

Mutating Objects with the Same Reference

let obj1 = { name: "John" };
let obj2 = obj1;
Copy after login

Here, obj1 and obj2 are the same object. Both variables point to the same memory location. If you change the value at this location, it will be reflected in both variables.

Example

obj2.name = "Jane"; // obj1 -> { name: "Jane" }, obj2 -> { name: "Jane" }
Copy after login

To visualize how this would look in memory:

Memory location 1: { name: "John" }

obj1 -> Memory location 1
obj2 -> Memory location 1
Copy after login

With the update:

let str = "hello";
str = "Hello"; // str -> "Hello"
Copy after login
Copy after login

We updated the value in memory location 1. It's only natural that both obj1 and obj2 reflect this change since they both reference the same memory location.


Conclusion

Primitive types are immutable and optimized for memory usage with techniques like string interning, while reference types allow for greater flexibility through mutability and shared references. By mastering these concepts, you can better predict and control the behavior of your code, leading to more robust and maintainable applications.

The above is the detailed content of Different Data types in JavaScript.. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template