Skip to main content

Assignment Operators

In JavaScript, assignment operators are used to assign values to variables. They allow you to update the value of a variable based on its current value or the value of another variable. Assignment operators combine the assignment (=) operator with another operator to perform an operation and assign the result to a variable.

Let's explore the assignment operators available in JavaScript:

Assignment Operator (=)

The assignment operator (=) is used to assign a value to a variable. It assigns the value on the right side of the operator to the variable on the left side.

Here is an example of using the assignment operator to assign a value to a variable:

assignment.js
let x = 5;
console.log(x); // Output: 5

Here are some assignment operators with arithmetic operators:

Addition Assignment Operator (+=)

The addition assignment operator (+=) adds the value on the right side of the operator to the variable on the left side and assigns the result to the variable.

It is the same as writing x = x + y, where x is the variable being updated and y is the value being added. Here is an example:

addition-assignment.js
let x = 5;
let y = 3;
x += y; // Equivalent to x = x + y
console.log(x); // Output: 8

Subtraction Assignment Operator (-=)

The subtraction assignment operator (-=) subtracts the value on the right side of the operator from the variable on the left side and assigns the result to the variable.

It is the same as writing x = x - y, where x is the variable being updated and y is the value being subtracted. Here is an example:

subtraction-assignment.js
let x = 5;
let y = 3;
x -= y; // Equivalent to x = x - y
console.log(x); // Output: 2

Multiplication Assignment Operator (*=)

The multiplication assignment operator (*=) multiplies the variable on the left side by the value on the right side and assigns the result to the variable.

It is the same as writing x = x * y, where x is the variable being updated and y is the value being multiplied. Here is an example:

multiplication-assignment.js
let x = 5;
let y = 3;
x *= y; // Equivalent to x = x * y
console.log(x); // Output: 15

Division Assignment Operator (/=)

The division assignment operator (/=) divides the variable on the left side by the value on the right side and assigns the result to the variable.

It is the same as writing x = x / y, where x is the variable being updated and y is the value being divided. Here is an example:

division-assignment.js
let x = 6;
let y = 3;
x /= y; // Equivalent to x = x / y
console.log(x); // Output: 2

Modulus Assignment Operator (%=)

The modulus assignment operator (%=) calculates the remainder of dividing the variable on the left side by the value on the right side and assigns the result to the variable.

It is the same as writing x = x % y, where x is the variable being updated and y is the value being used to calculate the remainder. Here is an example:

modulus-assignment.js
let x = 7;
let y = 3;
x %= y; // Equivalent to x = x % y
console.log(x); // Output: 1

Exponentiation Assignment Operator (**=)

The exponentiation assignment operator (**=) raises the variable on the left side to the power of the value on the right side and assigns the result to the variable.

It is the same as writing x = x ** y, where x is the variable being updated and y is the value being used as the exponent. Here is an example:

exponentiation-assignment.js
let x = 2;
let y = 3;
x **= y; // Equivalent to x = x ** y
console.log(x); // Output: 8

Assignment operators are a convenient way to update the value of a variable based on an operation. They combine the assignment operator with another operator to perform the operation and assign the result to the variable. By using assignment operators, you can write more concise and readable code when updating variables in JavaScript. There are also other assignment operators in Javascript. Let's briefly discuss them.

Bitwise Assignment Operators

JavaScript provides bitwise assignment operators that perform bitwise operations on variables and assign the result to the variable. These operators are used to manipulate the binary representation of numbers. Here are the bitwise assignment operators available in JavaScript:

Bitwise AND Assignment Operator (&=)

The bitwise AND assignment operator (&=) performs a bitwise AND operation on the variable on the left side and the value on the right side and assigns the result to the variable.

It is the same as writing x = x & y, where x is the variable being updated and y is the value being used in the bitwise AND operation. Here is an example:

bitwise-and-assignment.js
let x = 5; // Binary: 101
let y = 3; // Binary: 011
x &= y; // Equivalent to x = x & y (Binary: 101 & 011 = 001)
console.log(x); // Output: 1

In the example above, the bitwise AND operation is performed on the binary representation of the variables x and y, and the result is assigned to the variable x.

Bitwise OR Assignment Operator (|=)

The bitwise OR assignment operator (|=) performs a bitwise OR operation on the variable on the left side and the value on the right side and assigns the result to the variable.

It is the same as writing x = x | y, where x is the variable being updated and y is the value being used in the bitwise OR operation. Here is an example:

bitwise-or-assignment.js
let x = 5; // Binary: 101
let y = 3; // Binary: 011
x |= y; // Equivalent to x = x | y (Binary: 101 | 011 = 111)
console.log(x); // Output: 7

In the example above, the bitwise OR operation is performed on the binary representation of the variables x and y, and the result is assigned to the variable x.

Bitwise XOR Assignment Operator (^=)

The bitwise XOR assignment operator (^=) performs a bitwise XOR operation on the variable on the left side and the value on the right side and assigns the result to the variable.

It is the same as writing x = x ^ y, where x is the variable being updated and y is the value being used in the bitwise XOR operation. Here is an example:

bitwise-xor-assignment.js
let x = 5; // Binary: 101
let y = 3; // Binary: 011
x ^= y; // Equivalent to x = x ^ y (Binary: 101 ^ 011 = 110)
console.log(x); // Output: 6

In the example above, the bitwise XOR operation is performed on the binary representation of the variables x and y, and the result is assigned to the variable x.

We also have the bitwise shift assignment operators in JavaScript. Let's discuss them briefly.

Bitwise Shift Assignment Operators

JavaScript provides bitwise shift assignment operators that shift the bits of a variable to the left or right by a specified number of positions and assign the result to the variable. These operators are used to shift the binary representation of numbers. Here are the bitwise shift assignment operators available in JavaScript:

Bitwise Left Shift Assignment Operator (<<=)

The bitwise left shift assignment operator (<<=) shifts the bits of the variable on the left side to the left by the number of positions specified by the value on the right side and assigns the result to the variable.

It is the same as writing x = x << y, where x is the variable being updated and y is the number of positions to shift the bits. Here is an example:

bitwise-left-shift-assignment.js
let x = 5; // Binary: 101
let y = 2;
x <<= y; // Equivalent to x = x << y (Binary: 101 << 2 = 10100)
console.log(x); // Output: 20

In the example above, the bits of the variable x are shifted to the left by 2 positions, and the result is assigned to the variable x.

Bitwise Right Shift Assignment Operator (>>=)

The bitwise right shift assignment operator (>>=) shifts the bits of the variable on the left side to the right by the number of positions specified by the value on the right side and assigns the result to the variable.

It is the same as writing x = x >> y, where x is the variable being updated and y is the number of positions to shift the bits. Here is an example:

bitwise-right-shift-assignment.js
let x = 20; // Binary: 10100
let y = 2;
x >>= y; // Equivalent to x = x >> y (Binary: 10100 >> 2 = 101)
console.log(x); // Output: 5

In the example above, the bits of the variable x are shifted to the right by 2 positions, and the result is assigned to the variable x.

Bitwise Zero-Fill Right Shift Assignment Operator (>>>=)

The bitwise zero-fill right shift assignment operator (>>>=) shifts the bits of the variable on the left side to the right by the number of positions specified by the value on the right side and assigns the result to the variable. It fills the leftmost positions with zeros.

It is the same as writing x = x >>> y, where x is the variable being updated and y is the number of positions to shift the bits. Here is an example:

bitwise-zero-fill-right-shift-assignment.js
let x = -20; // Binary: 11111111111111111111111111101100
let y = 2;
x >>>= y; // Equivalent to x = x >>> y (Binary: 11111111111111111111111111101100 >>> 2 = 00111111111111111111111111111101)
console.log(x); // Output: 1073741821

In the example above, the bits of the variable x are shifted to the right by 2 positions, and the result is assigned to the variable x. The leftmost positions are filled with zeros.

We also have the logical assignment operators in JavaScript. Let's discuss them briefly.

Logical Assignment Operators

JavaScript provides logical assignment operators that perform logical operations on variables and assign the result to the variable. These operators are used to combine logical operations with assignment in a single step. Here are the logical assignment operators available in JavaScript:

Logical AND Assignment Operator (&&=)

The logical AND assignment operator (&&=) performs a logical AND operation on the variable on the left side and the value on the right side and assigns the result to the variable.

It is the same as writing x = x && y, where x is the variable being updated and y is the value being used in the logical AND operation. Here is an example:

logical-and-assignment.js
let x = true;
let y = false;
x &&= y; // Equivalent to x = x && y
console.log(x); // Output: false

In the example above, the logical AND operation is performed on the variables x and y, and the result is assigned to the variable x.

Logical OR Assignment Operator (||=)

The logical OR assignment operator (||=) performs a logical OR operation on the variable on the left side and the value on the right side and assigns the result to the variable.

It is the same as writing x = x || y, where x is the variable being updated and y is the value being used in the logical OR operation. Here is an example:

logical-or-assignment.js
let x = true;
let y = false;
x ||= y; // Equivalent to x = x || y
console.log(x); // Output: true

In the example above, the logical OR operation is performed on the variables x and y, and the result is assigned to the variable x.

Nullish Coalescing Assignment Operator (??=)

The nullish coalescing assignment operator (??=) assigns the value on the right side to the variable on the left side if the variable on the left side is null or undefined.

It is the same as writing x = x ?? y, where x is the variable being updated and y is the value being assigned if x is null or undefined. Here is an example:

nullish-coalescing-assignment.js
let x = null;
let y = 5;
x ??= y; // Equivalent to x = x ?? y
console.log(x); // Output: 5

In the example above, the value of the variable x is assigned to y because x is null.

Conclusion

In the above examples, we have discussed the assignment operators available in JavaScript, including the bitwise assignment operators. These operators allow you to perform operations and assign the result to a variable in a single step, making your code more concise and readable.

In the next section, we will learn about comparison operators in JavaScript. Let's keep going! 🚀

Made with ❤️ by Fasakin Henry