jQuery update JSON with string keys

Question

I have JSON data in array variable and I want to update some value in this array by string keys. Here is what's my array look like:

{
    "all": [
        {
            "image":{
                "URL":"img/img1.jpeg",
                "font": "sfsdfsdf",
                "color": "sfsdfs"
            },
            "music": {
                "URL":"fsfsfd",
                "time": {
                    "start":"sfsdf",
                    "end":"qdqsd"
                }
            }
        },
        {
            "image":{
                "URL":"img/img2.jpeg",
                "font": "sfsdfsdf",
                "color": "sfsdfs"
            },
            "music": {
                "URL":"fsfsfd",
                "time": {
                    "start":"sfsdf",
                    "end":"qdqsd"
                }
            }
        }
    ]
}

I have a second array with the path splitted of the key I want to update like this:

var path = ["all", 0, "image", "font"]

For the moment I just loop path variable and search in my JSON data if the key exist. But I have absolutly no idea how to update my JSON array without altering the schema of the array...

For example I want to replace myArray[all][0][image][font] value by "My Other Value"

The final goal is to have my JSON array updated and rewrite a JSON file.

EDIT :

I found the solution here : Dynamically updating a JavaScript object from a string path

Michael Geary · Answer 1 · 2018-06-03T20:55:49.257

First, it's worth noting that this has nothing to do with jQuery.

In any case, an easy way to do this is to use the _.get() function from Lodash. It does exactly what you are looking for.

This is also a pretty simple piece of code to write yourself, but Lodash has many other good and well-tested utility functions, so it's worth your while to get familiar with it. Here's a test:

let data = {
    "all": [
        {
            "image":{
                "URL":"img/img1.jpeg",
                "font": "sfsdfsdf",
                "color": "sfsdfs"
            },
            "music": {
                "URL":"fsfsfd",
                "time": {
                    "start":"sfsdf",
                    "end":"qdqsd"
                }
            }
        },
        {
            "image":{
                "URL":"img/img2.jpeg",
                "font": "sfsdfsdf",
                "color": "sfsdfs"
            },
            "music": {
                "URL":"fsfsfd",
                "time": {
                    "start":"sfsdf",
                    "end":"qdqsd"
                }
            }
        }
    ]
};

let path = [ "all", 0, "image", "font" ];

let value = _.get( data, path );

console.log( value );

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.10/lodash.min.js"></script>

My goal isn't to get the value of my path I know how to do it. My goal is to update the key path and return the array `data` complete with the modification. Does Lodash can do that ? — Cracs, Jun 04 '18 at 07:24

jQuery update JSON with string keys

1 Answers1