If strings are immutable in Javascript, why does the += operator work the way it does?

user_6581190 0
Viewed 87

Everything I'm reading about modifying strings in Javascript says that strings are immutable. Hence why concat returns a new string that is a modification of the original:

let originalString = 'hello';
let modifiedString = originalString.concat(' world');
console.log('originalString:', originalString);
console.log('modifiedString:', modifiedString);

results in:

"originalString: hello"

"modifiedString: hello world"

So far it makes sense. The original string remains even after concat because strings are immutable.

However, if I do the following:

let originalString2 = 'hello';
let modifiedString2 = originalString2 += ' world';
console.log('originalString2:', originalString2);
console.log('modifiedString2:', modifiedString2)

the result is:

"originalString2: hello world"

"modifiedString2: hello world"

This sure seems like it's mutating the original string to me. If that is not what's happening, can someone explain it to me? I've even found articles that go over the ways to modify strings that say at the beginning "Javascript strings are immutable" and later go on to say that the += method is mutating the original string, so I'm getting contradictory information.

JSFiddle of the simple test

javascript
1 Answers

I think it's because of the short hand addition operator (+=) you're using. It's actually doing 2 operations first addition then assignment.

let x = 2;
x += 2;
// The above line is equivalent to the following.
x = x + 2;

So for you're example

let str = "hello";
str += "world"; // is the same as 
str = str + "world";

So we are making a new string by str + "world" then assigning it to our str variable. So it's still immutable :)

user_152367610
Related