• JavaScript Video Tutorials

JavaScript - Symbol.for() method

In JavaScript, symbols are a basic data type that were added to create unique identifiers. Symbols are useful for creating keys in various contexts, such as object properties or Map keys, because they are guaranteed to be unique, unlike strings.

The Symbol.for() method takes the symbol's description and searches for a symbol with the given description in the global symbol registry. If the supplied description is found in an existing symbol, it returns that symbol; if not, it creates a new symbol and adds it to the global registry.

Syntax

Following is the syntax of JavaScript Symbol.for() method −

Symbol.for(key)

Parameters

This method accepts only one parameter. The same is described below −

  • key − It is the key for the symbol and also used as description of the symbol.

Return value

This method returns the existing symbol with the given key if found, otherwise a new symbol is created and returned.

Examples

Example 1

Let's look at the following example, where we are going to create the symbol and retrieving it.

<html>
   <style>
      p {
         font-family: verdana;
         color: #DE3163;
      }
   </style>
   <body>
      <p id="demo"></p>
      <script>
         const tp = Symbol.for('Tutorial');
         const retrive = Symbol.for('Tutorial');
         document.getElementById('demo').innerHTML = tp === retrive;
      </script>
   </body>
</html>

If we execute the above program, it will displays the 'true' text on the webpage.

Example 2

Consider the following example, where we are going to use the symbols for object properties.

<html>
   <style>
      p {
         font-family: verdana;
         color: #DE3163;
      }
   </style>
   <body>
      <p id="demo"></p>
      <script>
         const obj = {
            [Symbol.for('examp1')]: 'TP',
            [Symbol.for('examp2')]: 'TutorialsPoint'
         };
         document.getElementById('demo').innerHTML = obj[Symbol.for('examp2')];
      </script>
   </body>
</html>

On executing the above script, it will displays a text on the webpage.

Example 3

In the following example, we are going to check if a symbol with the given key exists or not.

<html>
   <style>
      body {
         font-family: verdana;
         color: #DE3163;
      }
   </style>
   <body>
      <script>
         const key = Symbol.for('tp');
         if (Symbol.keyFor(key)) {
            document.write('Yes, The Symbol Exists.');
         } else {
            document.write('No, The Symbol Doesnt Exists.');
         }
      </script>
   </body>
</html>

When we execute the script, it will displays a text on the webpage.

Example 4

Following is the example, where we are going to get the key from the symbol.

<html>
   <style>
      body {
         font-family: verdana;
         color: #DE3163;
      }
   </style>
   <body>
      <script>
         let tp = Symbol.for('TutorialsPoint');
         let x = Symbol.keyFor(tp);
         document.write(x);
      </script>
   </body>
</html>

On executing the above script, the output window will pop up, displaying the text on the webpage.

Advertisements