JavaScript assignment operators are used to assign values to variables. They perform basic operations and store the results in variables. Here are the most commonly used assignment operators in JavaScript, along with examples to illustrate their usage.
Basic Assignment Operator
= (Assignment)
The assignment operator = assigns the value on the right to the variable on the left.
let a = 10; // a is assigned the value 10
let b = 'hello'; // b is assigned the value 'hello'
Arithmetic Assignment Operators
Arithmetic assignment operators combine an arithmetic operation with assignment. They perform the operation and then assign the result to the variable.
+= (Addition Assignment)
Adds the right operand to the left operand and assigns the result to the left operand.
a += 3; // equivalent to a = a + 3
console.log(a); // outputs 8
-= (Subtraction Assignment)
Subtracts the right operand from the left operand and assigns the result to the left operand.
a -= 3; // equivalent to a = a - 3
console.log(a); // outputs 2
*= (Multiplication Assignment)
Multiplies the right operand with the left operand and assigns the result to the left operand.
a *= 3; // equivalent to a = a * 3
console.log(a); // outputs 15
/= (Division Assignment)
Divides the left operand by the right operand and assigns the result to the left operand.
a /= 2; // equivalent to a = a / 2
console.log(a); // outputs 5
%= (Remainder Assignment)
Calculates the remainder when the left operand is divided by the right operand and assigns the result to the left operand.
a %= 3; // equivalent to a = a % 3
console.log(a); // outputs 1
**= (Exponentiation Assignment)
Raises the left operand to the power of the right operand and assigns the result to the left operand.
a **= 3; // equivalent to a = a ** 3
console.log(a); // outputs 8
Bitwise Assignment Operators
Bitwise assignment operators perform bitwise operations on operands and then assign the result to the variable.
&= (Bitwise AND Assignment)
Performs a bitwise AND operation on the operands and assigns the result to the left operand.
a &= 3; // 0011 in binary, result is 0001
console.log(a); // outputs 1
|= (Bitwise OR Assignment)
Performs a bitwise OR operation on the operands and assigns the result to the left operand.
a |= 3; // 0011 in binary, result is 0111
console.log(a); // outputs 7
^= (Bitwise XOR Assignment)
Performs a bitwise XOR operation on the operands and assigns the result to the left operand.
a ^= 3; // 0011 in binary, result is 0110
console.log(a); // outputs 6
<<= (Left Shift Assignment)
Shifts the bits of the left operand to the left by the number of positions specified by the right operand and assigns the result to the left operand.
a <<= 1; // result is 1010
console.log(a); // outputs 10
>>= (Right Shift Assignment)
Shifts the bits of the left operand to the right by the number of positions specified by the right operand and assigns the result to the left operand.
a >>= 1; // result is 0010
console.log(a); // outputs 2
>>>= (Unsigned Right Shift Assignment)
Shifts the bits of the left operand to the right by the number of positions specified by the right operand, filling the leftmost bits with zeros, and assigns the result to the left operand.
a >>>= 1; // result is 0111...1101 (fills with zeros)
console.log(a); // outputs a large positive number due to unsigned shift
Logical Assignment Operators
Logical assignment operators combine logical operations with assignment.
&&= (Logical AND Assignment)
Assigns the right operand to the left operand if the left operand is truthy.
let b = false;
a &&= b; // equivalent to a = a && b
console.log(a); // outputs false
||= (Logical OR Assignment)
Assigns the right operand to the left operand if the left operand is falsy.
let b = true;
a ||= b; // equivalent to a = a || b
console.log(a); // outputs true
??= (Nullish Coalescing Assignment)
Assigns the right operand to the left operand if the left operand is null or undefined.
let b = 5;
a ??= b; // equivalent to a = a ?? b
console.log(a); // outputs 5
Practical Examples
Let's look at some practical examples that use multiple assignment operators together in common scenarios.
Example 1: Updating a Score
Consider a game where you need to update a player's score based on different events.
// Player scores a goal
score += 10; // Add 10 points
console.log(score); // outputs 10
// Player commits a foul
score -= 5; // Subtract 5 points
console.log(score); // outputs 5
// Player's score doubles
score *= 2; // Double the score
console.log(score); // outputs 10
Example 2: Managing Inventory
In an inventory management system, you might use assignment operators to update stock levels.
// New shipment arrives
stock += 50; // Add 50 units
console.log(stock); // outputs 150
// Sale of items
stock -= 20; // Subtract 20 units
console.log(stock); // outputs 130
// Items returned
stock += 10; // Add 10 units
console.log(stock); // outputs 140
Example 3: Configuring Settings
In a web application, you might configure settings with default values using logical assignment operators.
theme: 'dark',
language: 'en',
notifications: null
};
// User updates settings
config.theme ||= 'light'; // Keep current value since it's truthy
config.language ||= 'es'; // Update to 'es' if current value is falsy
config.notifications ??= true; // Update to true if current value is null or undefined
console.log(config); // outputs { theme: 'dark', language: 'en', notifications: true }
Practice Excercise Practice now