How does editing a Javascript Object in a recursive function successfully edit the real object?

Question

I wrote a recursive function which takes a '.' separated object path, and a payload. It then modifies the matching key of the object with the payload.

The function is as follows:

function objWalker(object, path, payload) {
    let pathArr = path.split(".");
    if (pathArr.length > 1) {
        objWalker(object[pathArr[0]], //new object
          path.slice(path.indexOf(".") + 1), //new shortened path
          payload);
    } else {
        object[path] = payload;
    }
}


const testObject = {
    a: {
        b: {
            c: {
                d: "e"
            }
        }
    },
    ab: "cd",
    abc: {
        def: {
            ghi: ["j", "k"]
        }
    }
};
objWalker(testObject, "abc.def.ghi", { new: "element" })
console.log(testObject)

This function works fine. When I looked into deeper why this works, one doubt I had is: For every recursive call to function objectWalker, the first parameter I am passing is object[pathArr[0]]. When this function is called again as a result, with object[pathArr[0]], does this not create a new variable tied to the new function call?

What I mean to say is, what connection does the object variable in the current recursive call has with the object variable of the previous recursive call, so that when the function exits the current call after changing the object variable, it is reflected in the final result?

And when we are hitting the else condition after 'n' recursive calls finally, according to my understanding, the current object in the function has no connection to the original object. Then when we finally make the change, i.e. object[path] = payload, and the function exits all the calls, how does the change reflect in the original object? How does that work?

Objects are [passed by reference](https://stackoverflow.com/questions/373419/whats-the-difference-between-passing-by-reference-vs-passing-by-value) — Guy Incognito, May 04 '23 at 16:23
That's how recursion works. Each time you call the function, it gets a new activation with its own values of the parameter variables. — Barmar, May 04 '23 at 16:23
JS never makes copies of objects automatically. When you pass an object, the function receives a reference to the original object, and any changes it makes apply to that object. — Barmar, May 04 '23 at 16:24
Does this answer your question? [Is JavaScript a pass-by-reference or pass-by-value language?](https://stackoverflow.com/questions/518000/is-javascript-a-pass-by-reference-or-pass-by-value-language) — jabaa, May 04 '23 at 16:43

score 2 · Accepted Answer · answered May 04 '23 at 23:53

All objects are addresses towards the function so unlike C an object is never copied. It is still considered pass by value.

So the binding you get points to an object. If you change the binding by altering what the variable is supposed to be it never changes the object but just re-references the variable.

When you update a property on an object you are no longer altering a variable. You are changing the property of an object. You are mutating and all references / properties that has that object will get the updated version.

How does editing a Javascript Object in a recursive function successfully edit the real object?

1 Answers1