0

I'm working with an object similar to the following (although this object has 4 key/value pairs, my actual object can have any number of them):

var myObj = {
  action: 'open',
  card: 'Comment card name',
  id: '54AEF364',
  url: 'www.myurl.com'
};

I'm trying to add the keys and values into a single string, separated by ":" and "|", like this:

var myString = 'action:open|card:Comment card name|id:54AEF364|url:www.myurl.com'

I'm attempting to do this using a for...in loop:

for (var i in myObj) {
  var myString += i + ':' + myObj[i] + '|';
}

I'm able to get most of what I need, with 2 exceptions:

  1. 'undefined' occurs before the first property name
  2. for the last key/value pair, there shouldn't be a "|" after the final value, since this is the end of the string

How can I accomplish this?

asw1984
  • 713
  • 1
  • 7
  • 17
  • Is order important? – MinusFour Nov 02 '17 at 19:33
  • Remove the last char from myString. [Have a look here](https://stackoverflow.com/questions/952924/javascript-chop-slice-trim-off-last-character-in-string) – Eugene Nov 02 '17 at 19:35
  • 2
    if order is important, note that property key order is technically not specified (i.e. not guaranteed to be in any order). Most browsers however, with exception of keys that parse as Numbers, will retain the key order. – Jochen Bedersdorfer Nov 02 '17 at 19:40
  • 1
    @JochenBedersdorfer To go along with that comment, OP should read this answer: [Does JavaScript Guarantee Object Property Order?](https://stackoverflow.com/a/5525820/691711). This question is fundamentally flawed. There is no such thing as "first" or "last" property. – zero298 Nov 02 '17 at 19:49

3 Answers3

4

Using map and array join:

const myObj = {
  action: 'open',
  card: 'Comment card name',
  id: '54AEF364',
  url: 'www.myurl.com'
};

const myObjSerialized = Object.keys(myObj).map(key => `${key}:${myObj[key]}`).join('|');
console.log(myObjSerialized);
Jose Mato
  • 2,709
  • 1
  • 17
  • 18
  • I am trying to understand map some more. wouldn't you run into an error if myObj[key] if null or undefined? – Ammar Nov 02 '17 at 20:02
  • 2
    Hi Ammar map just iterate over an array, the object always has keys and if some key has a null value then the code i put will just convert to string (because of javascript templates). If we need to know if values are null or undefined, then we can filter first and then use map. – Jose Mato Nov 02 '17 at 20:06
  • I just tested it and you are right. I think that is a case that @asw1984 should consider. Thanks. – Ammar Nov 02 '17 at 20:16
0

You can always go for the trusty ol' standard for loop and iterate the object's keys.

var myObj = {
  action: 'open',
  card: 'Comment card name',
  id: '54AEF364',
  url: 'www.myurl.com'
};

var serialize = function(data){
  var keys = Object.keys(data), string = "";
  for(var k=0; k<keys.length; ++k){
    if(k > 0) string += '|';
    string += keys[k]+':'+data[keys[k]];
  }
  return string;
}

console.log(serialize(myObj));
JstnPwll
  • 8,585
  • 2
  • 33
  • 56
0

Undefined is related to the variables myString. You have to declare the variable before using it in the for loop :

var myObj = {
  action: 'open',
  card: 'Comment card name',
  id: '54AEF364',
  url: 'www.myurl.com'
};
var myString = "";
for (var i in myObj) {
  myString += i + ':' + myObj[i] + '|';
}
console.log(myString);

Then you can remove the last "|" like that :

if (myString.length > 0) {
  myString = myString.substring(0, myString.length - 1);
}

However there is a more elegant way. Replace the string with an array and join the items at the end of the loop :

var myArray = [];
for (var i in myObj) {
  myArray.push(i + ':' + myObj[i]);
}
var myString = myArray.join("|");