Assignment Operator in JavaScript with Examples

JavasSript Assignment Operator

The assignment operator in JavaScript stores and updates values. It helps you hold data in a variable and change it when needed.

Understand the Assignment Operator in JavaScript

An assignment operator sets a value inside a variable. It also updates that value later in your code.

JavaScript starts with the basic = but adds more types. You can add, subtract, or combine logic with assignments.

They reduce steps. You do more with fewer lines. They make your code faster to write and easier to read.

The assignment operator comes between a variable and a value.

let x = 5;

This line puts the number 5 inside the variable x. The equal sign does not mean equality. It means the value on the right goes into the variable on the left.

You assign when you first declare a variable. You can also reassign after that.

let name = "Ali";
name = "Zee";

First, name holds “Ali”. Then you change it to “Zee”. JavaScript lets you replace the old value at any time.

For example:

let a = 10;
let b = 5;
a = b;

Here, a gets the value inside b. So a now holds 5.

You copy values from one variable into another. The right side always controls what happens.

We can categorize them into 4 types:

  • Basic Assignment Operator
  • Compound Assignment Operators
  • Bitwise Assignment Operators
  • Logical Assignment Operators (ES2021+)

Let’s take each one in-depth.

Basic Assignment Operator in JavaScript

You write the variable name first, then the =, then the value. JavaScript reads it right to left. It sets the variable on the left to the value on the right.

Here is a simple example:

let name = "John";
let age = 30;
let active = true;

You can also store the outcome of an expression in a variable:

let total = 5 + 3; // total is 8

In the next part, you will see how JavaScript combines this basic operator with math to form arithmetic assignment operators.

Compound Assignment Operators

Addition assignment ( += ) adds the right value to the left variable. It stores the result in the same variable.

let x = 5;  
x += 3; // x is now 8

This adds 3 to x. The result replaces the old value of x.

Subtraction assignment ( -= ) subtracts the right value from the left variable. It stores the result back in the same variable.

let x = 10;  
x -= 4; // x is now 6

This takes away 4 from x. The new value becomes 6.

Multiplication assignment ( *= ) multiplies the left variable by the right value. It updates the variable with the new product.

let x = 3;  
x *= 5; // x is now 15

This multiplies 3 by 5 and sets x to the result.

Division assignment ( /= ) divides the left variable by the right value.
Saves the result in the same variable.

let x = 20;  
x /= 4; // x is now 5

This divides 20 by 4 and stores 5 in x.

Remainder assignment ( %= ) finds the remainder after division.
Assigns that remainder to the variable.

let x = 10;  
x %= 3; // x is now 1

This divides 10 by 3. The leftover 1 becomes the new value of x.

Bitwise Assignment Operators

AND assignment ( &= ) compares each bit of both values. It keeps the bit if both are 1.

let x = 6; // 110  
x &= 3;    // 011 → x is now 2 (010)

It compares bits of 6 and 3. Only the matching 1-bits stay.

OR assignment ( |= ) Compares each bit of both values. It makes the bit if at least one is 1.

let x = 6; // 110  
x |= 3;    // 011 → x is now 7 (111)

It combines bits of 6 and 3. Any 1 stays, even if only in one.

XOR assignment ( ^= ) compares each bit of both values and keeps the bit if the bits are different.

let x = 6; // 110  
x ^= 3;    // 011 → x is now 5 (101)

Bits that differ become 1. Matching bits become 0.

Left shift assignment ( <<= ) shifts bits to the left. It fills new bits with 0 on the right.

let x = 3; // 011  
x <<= 2;   // x is now 12 (1100)

Each left shift multiplies by 2. Two shifts give 3 * 4 = 12.

Right shift assignment ( >>= ) shifts bits to the right and keeps the sign bit on the left.

let x = -8; // in binary: ...11111000  
x >>= 2;    // x is now -2

It shifts right and keeps the sign. This works for negative numbers.

Unsigned right shift assignment ( >>>= ) shifts bits to the right.
Fills the left with 0, no sign bit.

let x = -8;  
x >>>= 2;   // x is now 1073741822

This treats x as unsigned. It shifts and fills with 0 on the left.

Logical Assignment Operators (ES2021+)

Logical AND assignment ( &&=) Only assigns if the left side is true and used to update values that are already set.

let isAdmin = true;  
isAdmin &&= 'full access'; // isAdmin is now 'full access'

If isAdmin is true, it changes the value. If false, it stays as is.

Logical OR assignment ( ||=) Only assigns if the left side is false. It is used to set default values.

let userName = '';  
userName ||= 'Guest'; // userName is now 'Guest'

Since userName is empty, it gets the default value.

Nullish coalescing assignment ( ??= ) only assigns if the left side is null or undefined. It is useful when 0 or ” are valid values.

let score = 0;  
score ??= 10; // score stays 0

score is not null or undefined, so the value does not change.

Wrapping Up

In this article you learned how assignment operators store and update values, and how to use each type with clear examples. You also saw how they speed up logic and simplify code.

Here is a quick recap:

  • = puts a value in a variable
  • +=, -=, *=, /=, %= change a number directly
  • &=, |=, ^=, <<=, >>=, >>>= use bit math
  • &&=, ||=, ??= handle logic and fallback values
  • Each one saves time and avoids extra steps

Thank you for reading. To read more JavaScript tutorials, click here.

FAQs

What is the assignment operator in JavaScript?

It is the = sign. You use it to give a value to a variable.

What does += do in JavaScript?

It adds a number to the current value and stores the result.

When should I use logical assignment operators?

Use them when you want to set default values or skip updates for false data.

What is the use of ??=?

It assigns a value only when the original one is null or undefined.

What is the difference between |= and ||=?

|= works on bits. ||= works on logic. One uses binary math. The other checks true or false.

Similar Reads

Flatten an Array in JavaScript: Use flat() to Handle Nested Arrays

Arrays often hold other arrays. This happens with API responses, form data, or nested objects. These layers add extra steps…

Understanding JavaScript Objects with Examples

JavaScript Objects hold values as key and value pairs, and they help you store and access data. Understand the JavaScript…

Math.cbrt in JavaScript: How to Finds Cube Roots

JavaScript added Math.cbrt to solve cube roots. Before that, developers used custom code or Math.pow with 1/3. It works with…

JavaScript Math floor: How It Works with Examples

JavaScript gives you several ways to round numbers, but not all of them round the same way. If you want…

JavaScript toReversed Function with Examples

JavaScript toReversed returns a new array with the reversed order of its elements. It does not change the original array…

Bitwise Operators in JavaScript

Bitwise operators work with binary data at the bit level in JavaScript. They process numbers in binary form and return…

JavaScript Math acos Function

The Math.acos function finds the angle in radians from a cosine value in JavaScript. It gives a value between 0…

JavaScript Polyfilling & Transpiling Guide for Beginners

JavaScript moves fast, and new features come. Some browsers do not support these features and cause issues for users. Developers…

Print in JavaScript Console Using Log, Info, Warn, and Error

The JavaScript console is a tool in web browsers that helps you print the result to the web browser. It…

Arrow Function in JavaScript: How it Works with Examples

Arrow function gives you short code and keeps this in the right scope in JavaScript. Understand the Arrow Function in…

Previous Article

PHP strlen Function: How It Works with Strings

Next Article

PHP strtolower Function: Convert Strings to Lowercase

Write a Comment

Leave a Comment

Your email address will not be published. Required fields are marked *


Subscribe to Get Updates

Get the latest updates on Coding, Database, and Algorithms straight to your inbox.
No spam. Unsubscribe anytime.