Creating JavaScript dictionary while preserving quotes and escapes

Question

I've got the following object:

var data = {
            "parameter": []
        };

I want to add an element to it like so, preserving the quotes on the keys as well as the escapes within the string values:

data.parameter.push({
                "name": "TIBCO_Copy",
                "value": "[{\"Source_Server\":[" + tibcoCopyJobs.map(function (i) { return i.sourceServer; }).join(',') +
                                        "]},{\"Source_Path\":[" + tibcoCopyJobs.map(function (i) { return i.sourcePath; }).join(',') +
                                        "]},{\"Destination_Server\":[" + tibcoCopyJobs.map(function (i) { return i.destinationServer; }).join(',') +
                                        "]},{\"Destination_Path\":[" + tibcoCopyJobs.map(function (i) { return i.destinationPath; }).join(',') + "]}]"
            });

Expected result:

{
  "parameter": [
    {
      "name": "TIBCO_Copy",
      "value": "[{\"Source_Server\":[1s, 2s, 3s]},{\"Source_Path\":[1sp, 2sp, 3sp]},{\"Destination_Server\":[1d, 2d, 3d]},{\"Destination_Path\":[1dp, 2dp, 3dp]}]"
    }
  ]
}

Actual result as seen in chrome inspector:

name: "TIBCO_Copy",
value: "[{"Source_Server":[1,5]},{"Source_Path":[2,6]},{"Destination_Server":[3,7]},{"Destination_Path":[4,8]}]"

Notice that it interpreted the escaped quotes around the nested keys as well as the regular quotes on the top-level keys. Using JSON.stringify() preserves the escapes, but adds another set of quotes, making it:

name: "TIBCO_Copy", 
value: ""[{\"Source_Server\":[1,5]},{\"Source_Path\":[2,6]…on_Server\":[3,7]},{\"Destination_Path\":[4,8]}]""

In all of these though, I still have the issue of the name and value keys being interpreted since I can't seem to escape them.

I need it to be formatted this way because it gets POSTed to Jenkins to trigger a remote build, and then sent to Ansible via the Build over SSH plugin to be executed with Ansible's CLI. Thus the escaping is necessary for the data to be in the correct format when it reaches its destination.

Why don't you put the key - values in an array and JSON.stringuify it directly? — Juan, Nov 14 '17 at 01:30
@Juan I've tried several methods, could you provide a small example? — Darrel Holt, Nov 14 '17 at 17:05
It's only the view in Chrome inspector... Print the object to the web browser and you will see it is like you wish! Escape the value first with `JSON.stringify` and add it to the value property afterwards. That's exactly how it's done. — Joshua K, Nov 14 '17 at 17:47

Darrel Holt · Accepted Answer · 2017-11-17T00:12:55.403

I figured it out.

Instead of using JSON.stringify(), I just escape a backslash in addition to the escaped quote. The result is a \ followed by a ", being \". So now it looks like this:

data.parameter.push({
                "name": "TIBCO_Copy",
                "value": "[{\\\"Source_Server\\\":[" + tibcoCopyJobs.map(function (i) { return i.sourceServer; }).join(',') +
                        "]},{\\\"Source_Path\\\":[" + tibcoCopyJobs.map(function (i) { return i.sourcePath; }).join(',') +
                        "]},{\\\"Destination_Server\\\":[" + tibcoCopyJobs.map(function (i) { return i.destinationServer; }).join(',') +
                        "]},{\\\"Destination_Path\\\":[" + tibcoCopyJobs.map(function (i) { return i.destinationPath; }).join(',') + "]}]"
            });

EDIT: The above was a solution for preserving format when being parsed by the JS interpreter and was useful for when the data needs to be used again before sending it off with an HTTP request. However, my use case for the data changed, and it turns out that @JoshuaK in the comments on the original question above was mostly correct, if not spot on. Essentially, I left it with the singly escaped quotes rather than the escaped back slash with an escaped quote. When using it to POST via the standard method in AngularJS using $http I was able to declare the form-data to be a JSON object like so:

data: 'json=' + JSON.stringify(data)

The above is exactly as it appears in my associative array (dictionary) object containing the parameters for the call to $http. You can also see this other question for details on how I POSTed the data using the $http service of AngularJS.

Creating JavaScript dictionary while preserving quotes and escapes

1 Answers1