Open In App

How to access an object having spaces in the object’s key using JavaScript ?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

Given an object and the task is to access the object in which the key contains spaces. There are a few methods to solve this problem which are discussed below: 

Approach 1:

  • Create an object having space-separated keys.
  • Use square bracket notation instead of dot notation to access the property.

Example: This example implements the above approach. 

html




<h1 style="color:green;">
    GeeksforGeeks
</h1>
<p id="GFG_UP"></p>
<button onclick="GFG_Fun()">
    click here
</button>
<p id="GFG_DOWN"></p>
<script>
    var el_up = document.getElementById('GFG_UP');
    var el_down = document.getElementById('GFG_DOWN');
    var JSObject = {
        'Geeks': {
            Geeks1: 'Geeks1_val',
            Geeks2: 'Geeks2_val'
        },
        'Computer Science portal': {
            Geeks_1: 'A Computer Science portal for Geeks.',
            Geeks_2: 'Geeks_2_val'
        }
    }
    el_up.innerHTML = "Click on the button to access the "+
        "key of object<br><br>"+ JSON.stringify(JSObject);
      
    function GFG_Fun() {
        el_down.innerHTML =
        JSObject['Computer Science portal'].Geeks_1;
    }
</script>


Output:

How to access an object having spaces in the object's key using JavaScript ?

How to access an object having spaces in the object’s key using JavaScript ?

Approach 2:

  • Create an object having space-separated keys.
  • Take the key in a variable and use that variable in place of the key (But, Here also square bracket notation will work).

Example: This example implements the above approach. 

html




<h1 style="color:green;">
    GeeksforGeeks
</h1>
<p id="GFG_UP"></p>
<button onclick="GFG_Fun()">
    click here
</button>
<p id="GFG_DOWN"></p>
<script>
    var el_up = document.getElementById('GFG_UP');
    var el_down = document.getElementById('GFG_DOWN');
    var JSObject = {
        'Geeks': {
            Geeks1: 'Geeks1_val',
            Geeks2: 'Geeks2_val'
        },
        'Computer Science portal': {
            Geeks_1: 'A Computer Science portal for Geeks.',
            Geeks_2: 'Geeks_2_val'
        }
    }
    el_up.innerHTML = "Click on the button to access "+
        "the key of object<br><br>" + JSON.stringify(JSObject);
      
    function GFG_Fun() {
        var someKey = 'Computer Science portal';
        el_down.innerHTML = JSObject[someKey].Geeks_1;
    }
</script>


Output:

How to access an object having spaces in the object's key using JavaScript ?

How to access an object having spaces in the object’s key using JavaScript ?



Last Updated : 23 Jan, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads