Convert object's properties and values to array of key value pairs

Question

I'm fairly new to JavaScript and am not sure this is possible to do but basically I would like to take an object and convert it into an array of strings in the format; array[0] = 'prop1=value1'

The reasoning behind this is that I'm having a user enter a list of k=v pairs into a form, later it's written as an object within a json blob. Going from the key value csl to the json object was simple, now I need to go back the other way (I've received the JSON via an ajax call and want to populate a blank form). Is this possible in JavaScript? If not please offer a reasonable work around.

Sample code;

Object in debugger;

 Object
        private_key: "private-key"
        public_key: "public-key"

I need to convert that to;

 "private_key=private-key,public_key=public-key"

Basically I need something like this (pseudo code)

var outputString = '';
foreach (prop in obj)
{
    outputString = outputString + prop.tostring() + '=' + prop.value + ',';
}

Is there any reason why you aren't using JSON.parse() and JSON.stringify()? — NullUserException
– NullUserException, Commented Jan 30, 2013 at 23:17
Before this happens I've used JSON.parse() to get an object from the json. The problem is in displaying the property names and not just their values. — evanmcdonnal
– evanmcdonnal, Commented Jan 30, 2013 at 23:19
@evanmcdonnal: If you have found key-value-csl -> object to be simple, the reverse should be trivial as well? What have you tried, where are you stuck? — Bergi
– Bergi, Commented Jan 30, 2013 at 23:22

mojoaxel · Accepted Answer · 2017-11-24 10:32:48Z

42

You're probably looking for something along the lines of

var obj = {value1: 'prop1', value2: 'prop2', value3: 'prop3'};
var arr = [];
for (var key in obj) {
    if (obj.hasOwnProperty(key)) {
        arr.push(key + '=' + obj[key]);
    }
};
var result = arr.join(',');
alert(result);

Notice that it will work fine if your values are strings; if they're complex objects then you'll need to add more code.

Or you can just use jQuery.param, which does what you want, even for complex types (although it uses the & character as the separator, instead of the comma.

edited Nov 24, 2017 at 10:32

mojoaxel

1,6481 gold badge15 silver badges20 bronze badges

answered Jan 30, 2013 at 23:25

carlosfigueira

87.7k14 gold badges137 silver badges176 bronze badges

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

1 Comment

Juzer Ali Over a year ago

If you want to convert your object into a request query then using jQuery.params is always recommended over error prone, custom code.

Rashi Abramson · Accepted Answer · 2017-11-30 22:39:41Z

5

In ES6 you can use Object.entries({object1:1,object2:2});. The result is: [["object1",1],["object2",2]]

answered Nov 30, 2017 at 22:39

Rashi Abramson

1,26710 silver badges17 bronze badges

Comments

Plynx · Accepted Answer · 2013-01-30 23:24:52Z

4

var array = [];
for (k in o)
{
    if (o.hasOwnProperty(k))
    {
        array.push(k+"="+o[k]);
    }
}

You can then join the array for your final string.

answered Jan 30, 2013 at 23:24

Plynx

11.5k3 gold badges34 silver badges34 bronze badges

Comments

Bergi · Accepted Answer · 2016-11-29 03:41:52Z

4

var object = {
    private_key: "private-key",
    public_key: "public-key"
};

var array = [];
for (var prop in object)
    array.push(prop + "=" + object[prop]);
return array.join(','); // "private_key=private-key,public_key=public-key"

Notice the order is not guaranteed.

edited Nov 29, 2016 at 3:41

answered Jan 30, 2013 at 23:28

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

5 Comments

GoldBishop Over a year ago

It is guaranteed....just in alphabetical order instead of placed order.

Bergi Over a year ago

@GoldBishop Nope, it's not. If you want alphabetic order, do array.sort().join(',').

GoldBishop Over a year ago

Maybe its happen-stance, but it has been pretty reliable for me without using sort. But i also usually go from Object -> Array -> String or just Object -> String.

Bergi Over a year ago

Yes, it seems to be happen-stance. You cannot rely on it, but most implementations do keep definition order (I haven't heard of an alphabetic one).

GoldBishop Over a year ago

Could also be that Chrome applies its own sort when inspecting the various Types.

mojoaxel · Accepted Answer · 2017-11-24 10:08:24Z

2

obj = {
  private_key: "private-key",
  public_key: "public-key"
}

str = JSON.stringify(obj).replace(/[{}]/g, '').replace(/"/g, '').replace(/:/g, '=');
console.log("Using JSON.stringify:\n", str);

str = Object.keys(obj).map((key) => `${key}=${obj[key]}`).join(',')
console.log("Using ES6 keys/map:\n", str);

str = jQuery.param(obj).replace(/&/g,',');
console.log("Using jQuery.param:\n", str);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

answered Nov 24, 2017 at 10:08

mojoaxel

1,6481 gold badge15 silver badges20 bronze badges

Comments

Ram Pukar · Accepted Answer · 2018-05-11 07:34:40Z

2

var obj =[
            {'2018-05-07':1},
            {'2018-05-08':3},
            {'2018-05-09':2}
        ];

        for(var i of obj) {
            var key = Object.keys(i).toString();
            console.log(i,'=',i[key]);
        }

Result

:

answered May 11, 2018 at 7:34

Ram Pukar

1,63117 silver badges20 bronze badges

Comments

Ben Bucksch · Accepted Answer · 2021-01-19 00:29:57Z

0

1-liner:

Object.entries(yourObj).map(e => ({ name: e[0], value: e[1] }));

Example use:

let yourObj = { foo: "bar", baz: "bas" };

// turn object properties into array entries
let array = Object.entries(yourObj).map(e => ({ name: e[0], value: e[1] }));

// returns
array = [
  { name: "foo", value: "bar" },
  { name: "baz", value: "bas" },
]
// loop over it
for (let prop of array) {
  console.log(prop.name, "=", prop.value);
}
// shows
foo = bar
baz = bas

Alternatively, create string in the format you wanted:

Object.entries(yourObj).map(e => e[0] + "=" + e[1]).join(",");
"foo=bar,baz=bas"

edited Jan 19, 2021 at 0:29

answered Jan 19, 2021 at 0:23

Ben Bucksch

7296 silver badges21 bronze badges

Collectives™ on Stack Overflow

Convert object's properties and values to array of key value pairs

7 Answers 7

1 Comment

Comments

Comments

5 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

1 Comment

Comments

Comments

5 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related