Addition Assignment

The addition assignment (+=) operator evaluates the right operand, adds it to the value of the left operand, and assigns the resulting value back to the left operand. The specific operation performed—numeric addition or string concatenation—is dictated by the data types of the operands.

LeftOperand += RightOperand;

This operator is functionally equivalent to LeftOperand = LeftOperand + RightOperand, with the strict architectural distinction that the LeftOperand reference is evaluated only once.

Evaluation Mechanics and Type Coercion

Because JavaScript is dynamically typed, the += operator relies on the ECMAScript internal ToPrimitive algorithm and standard addition semantics to resolve the operation.

1. Numeric Addition If both operands are strictly of type Number, or if both operands are strictly of type BigInt, the operator performs standard mathematical addition. Mixing a Number operand with a BigInt operand is not permitted and will throw a TypeError.

let a = 5;
a += 10; // a is 15 (Number)

let b = 10n;
b += 5n; // b is 15n (BigInt)

let c = 5;
// c += 10n; // Throws TypeError: Cannot mix BigInt and other types

2. String Concatenation If either the left or right operand is a String (after any necessary primitive coercion), the operator forces string concatenation. The non-string operand is implicitly coerced into a string.

let str = "Hello";
str += " World"; // "Hello World" (String)

let mixed = 10;
mixed += "5"; // "105" (String) - Number 10 is coerced to String

3. Object to Primitive Coercion If an operand is an Object (including Array and Date), JavaScript attempts to convert it to a primitive value before applying the += operator. It does this by passing a "default" hint to the internal ToPrimitive algorithm. The resolution follows a specific hierarchy:

1. If the object implements a [Symbol.toPrimitive]() method, that method is invoked first.
2. If no such method exists, standard objects prioritize the valueOf() method. If valueOf() does not return a primitive, it falls back to the toString() method.
3. Date objects exhibit the exact opposite behavior: they prioritize toString() and fall back to valueOf().

let arr = [1, 2];
arr += [3, 4]; 
// arr becomes "1,23,4" (String)
// Arrays coerce to strings via toString(), resulting in "1,2" + "3,4"

let obj = 5;
obj += {}; 
// obj becomes "5[object Object]" (String)
// {} coerces to "[object Object]" via toString()

let dateStr = "Current: ";
dateStr += new Date("2023-01-01"); 
// dateStr becomes "Current: Sun Jan 01 2023..." (String)
// Date objects prioritize toString() over valueOf()

let customObj = 10;
customObj += {
  [Symbol.toPrimitive](hint) {
    return 5;
  }
};
// customObj becomes 15 (Number)
// [Symbol.toPrimitive]() is invoked first

4. Boolean, Null, and Undefined Coercion When interacting with numbers (and no strings are present), JavaScript coerces true to 1, false to 0, and null to 0. undefined coerces to NaN (Not-a-Number).

let num = 10;
num += true; // 11 (Number)
    
let val = 5;
val += null; // 5 (Number)

let undef = 5;
undef += undefined; // NaN (Number)

Master JavaScript with Deep Grasping Methodology!

Learn More