Extract JSON into Javascript variables

Question

I'm new at javascript and here is a newbie question:

In php, there is an extract() method which can import variables from an associative array. For example:

$var_array = array("color" => "blue",
                   "size"  => "medium",
                   "shape" => "sphere");
extract($var_array);
// $color is a defined varible here with the value of "blue"

I wonder if there is a method in standard Javascript, or in popular libraries like jQuery or underscore, that does the same for a Javascript Object. I mean something like this:

jsObject = {"color" : "blue",
            "size"  : "medium",
            "shape" : "sphere"};

extract(jsObject); // Is there such a thing?

// Here, color is a defined variable

why do you need it? You can just take the JSON and simply translate it as an object using JSON.parse(). Than you can easily access the color value using myObject.color — rakwaht
– rakwaht, Commented Feb 16, 2017 at 8:17
you can declare to window object (global scope): jsObject.forEach(function(value, key){ window[key] = value; }); — ramabarca
– ramabarca, Commented Feb 16, 2017 at 8:19

Titus · Accepted Answer · 2017-02-16 08:17:59Z

3

You can do something like this:

Object.getOwnPropertyNames(obj).forEach(k => window[k] = obj[k]);

Or to limit the scope of the new variables:

Object.getOwnPropertyNames(obj).forEach(k => this[k] = obj[k]);

answered Feb 16, 2017 at 8:17

Titus

22.6k1 gold badge26 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Arjun T Raj · Accepted Answer · 2017-02-16 08:16:24Z

2

You can use

function extract(jsObject){
    for (var key in jsObject) {
       window[key] = jsObject[key];
    }
}




 console.log(size)   //medium

answered Feb 16, 2017 at 8:16

Arjun T Raj

3,2071 gold badge24 silver badges44 bronze badges

Comments

TrillCyborg · Accepted Answer · 2017-02-16 08:25:09Z

2

There's nothing in standard Javascript that works quite like that but if you use ES6 you can destructure your objects like this

const obj = {
    color: 'blue',
    size: 'medium',
    shape: 'sphere',
}

const { color, size, shape } = obj;

console.log(color, size, shape) // blue medium sphere

You can use Babel to transpile your code to ES6. It may be a little advanced for you now if you're just starting out so I recommend you stick with the intuitive approach but after a few weeks definitely check out Babel. It gives you some really cool stuff.

answered Feb 16, 2017 at 8:25

TrillCyborg

462 bronze badges

Comments

Timothy Quang Phuc Nguyen · Accepted Answer · 2017-02-16 08:46:53Z

0

There are 2 problems with using window object:

It, and all of its properties are default global variables. Which may not be in interest.
There must be an assumption that it exists in all browsers (which it is now). Think about Nodejs

You can do:

for (var key in jsObject) {
    eval('var ' + key + ' = ' + jsObject[key]);
}

Try this, might help:

(function () {
    var jsObject = {color: 'blue'};

    // Dynamically assign to local variables
    for (var key in jsObject) {
        eval('var ' + key + ' = ' + jsObject[key]);
    }

    // Test locally
    console.log(color);
})();

// Test globally
console.log(color);

Results:

'blue'
[error] color is not defined

answered Feb 16, 2017 at 8:46

Timothy Quang Phuc Nguyen

7751 gold badge6 silver badges6 bronze badges

Collectives™ on Stack Overflow

Extract JSON into Javascript variables

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related