ReasonJun

javascript : symbol 본문

Frontend/Javasciprt

javascript : symbol

ReasonJun 2023. 6. 9. 00:14
728x90

In JavaScript, a Symbol is a primitive data type introduced in ECMAScript 2015 (ES6). It is a unique and immutable value that can be used as an identifier for object properties. Symbols are often used as keys in objects to avoid naming conflicts and ensure uniqueness.

const mySymbol = Symbol();
// create a Symbol using the Symbol() function
const mySymbol = Symbol('My Symbol');
// Symbols can also have an optional description, which is useful for debugging purposes

Symbols are guaranteed to be unique. Even if you create multiple symbols with the same description, they are considered different symbols:

const symbol1 = Symbol('My Symbol');
const symbol2 = Symbol('My Symbol');

console.log(symbol1 === symbol2); // Output: false

Symbols are primarily used as keys for object properties. They help avoid property name collisions in situations where multiple libraries or modules are working together. Here's an example:

const mySymbol = Symbol('My Symbol');
const obj = {};

obj[mySymbol] = 'Value';

console.log(obj[mySymbol]); // Output: "Value"

Symbols are not enumerable in for...in loops or by using the Object.keys() or Object.getOwnPropertyNames() methods. This means they won't be included when iterating over object properties using these methods. However, you can access them using Object.getOwnPropertySymbols():

const obj = {
  [Symbol('key')]: 'Value'
};

console.log(Object.getOwnPropertySymbols(obj)); // Output: [Symbol(key)]

JavaScript also provides a set of built-in symbols that have special meanings and behaviors. These include symbols such as Symbol.iterator, Symbol.toStringTag, and Symbol.hasInstance. They are used to define custom behaviors and features in objects.

Symbols are generally used in advanced scenarios, such as creating custom iterators, implementing private members, or extending the behavior of built-in objects. They provide a way to create unique identifiers and avoid naming conflicts in JavaScript applications.

 

const map = new Map();
const key3 = 'key';
const key4 = 'key';
map.set(key3, 'Hello');
console.log(map.get(key4)); // Hello : Because it is a primitive type, it is determined that the value is the same and the key is the same.

const key1 = Symbol('key');
const key2 = Symbol('key');
map.set(key1, 'Hello');
console.log(map.get(key2)); // undefined
console.log(key1 === key2); // false

// If you want to use one key with the same name, Symbol.for
// Global Symbol Registr
const k1 = Symbol.for('key');
const k2 = Symbol.for('key');
console.log(k1 === k2); //true

console.log(Symbol.keyFor(k1)); // key 
console.log(Symbol.keyFor(key1)); // undefined

const obj = { [k1]: 'Hello', [Symbol('key')]: 1 };
console.log(obj); // { [Symbol(key)]: 'Hello', [Symbol(key)]: 1 }
console.log(obj[k1]); // Hello
console.log(obj[Symbol('key')]); // undefined
728x90

'Frontend > Javasciprt' 카테고리의 다른 글

javascript : Web APIs (cookie)  (0) 2023.06.09
javascript : Web APIs (console)  (0) 2023.06.09
javascript : map  (0) 2023.06.09
javascript : set  (0) 2023.06.09
javascript : event (mouse pointer event, prevent basic work)  (0) 2023.06.09
Comments