JavaScript Symbol

What is a Symbol?

n JavaScript, a Symbol is a primitive data type introduced in ES6 (2015). It is used to create unique and immutable identifiers for object properties.

Each time you create a Symbol, even if they have the same description, they are completely unique.

How to Create a Symbol

You create a Symbol using the Symbol() function.

let sym1 = Symbol();
let sym2 = Symbol("description");

The description is optional — it is just for debugging purposes.

Example and Outputs

let sym = Symbol("id");
console.log(sym); // Output: Symbol(id)
let sym2 = Symbol("id");
console.log(sym === sym2); // Output: false

Even if two symbols have the same description, they are different and unique.

Why Use Symbols?

• To add hidden properties to objects.
• To avoid property name collisions.
• To create unique keys when working with objects or libraries.

Symbols as Object Properties

You can use Symbols as keys for object properties:

let id = Symbol("id");
let user = {
name: "John"
,
[id]: 123 // Symbol as a key
};
console.log(user); // Output: { name: "John"
, Symbol(id): 123 }
console.log(user[id]); // Output: 123

Note: To set a Symbol as a property key, you must use square brackets [].

Properties with Symbol Keys are Hidden

Symbol properties are not listed in:

• for...in loops
• Object.keys()
• Object.getOwnPropertyNames()

But they can be accessed using:

• Object.getOwnPropertySymbols()

Example:

let id = Symbol("id");
let person = {
name: "Alice"
,
[id]: 456
};
for (let key in person) {
console.log(key); // Output: name (Symbol is not shown)
}
console.log(Object.keys(person)); // Output: ["name"]
console.log(Object.getOwnPropertySymbols(person));
// Output: [ Symbol(id) ]

Global Symbols with Symbol.for()

You can create global symbols that can be shared across files using Symbol.for().

let globalId1 = Symbol.for("id");
let globalId2 = Symbol.for("id");
console.log(globalId1 === globalId2); // Output: true

Symbol.for("key") checks if a symbol with that key exists — if yes, returns it; if not, creates it.

Symbol Methods

Example:

let sym = Symbol.for("userId");
console.log(Symbol.keyFor(sym)); // Output: "userId"

Well-known Symbols

JavaScript provides some built-in symbols that you can use to customize object behavior.

Example:

Example:

let myObj = {
[Symbol.toStringTag]: "CustomObject"
};
console.log(Object.prototype.toString.call(myObj));
// Output: [object CustomObject]

Quick Recap

• Symbol creates unique and immutable values.
• Symbols are often used as hidden object keys.
• Symbols are not listed in normal property loops.
• Use Symbol.for() for global symbols.
• Useful for avoiding name clashes in objects and libraries.

Example Summary

let sym = Symbol("token");
let user = {
[sym]: "abc123"
};
console.log(user[sym]); // Output: "abc123"
console.log(Object.keys(user)); // Output: []
console.log(Object.getOwnPropertySymbols(user)); // Output:
[Symbol(token)]