-
Hajipur, Bihar, 844101
Hajipur, Bihar, 844101
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts
In JavaScript, assignment operators are used to assign values to variables. Beyond simple assignment, JavaScript provides combined assignment operators that allow you to perform an operation on a variable and simultaneously assign the result. These operators are essential for writing concise, readable, and efficient code. Understanding assignment operators is crucial for manipulating numbers, strings, arrays, and objects in practical applications.
This chapter covers the types of assignment operators, their behavior, operator precedence, practical examples using names, common mistakes, best practices, and real-world applications.
The most fundamental assignment operator is =. It assigns the value on the right-hand side to the variable on the left-hand side.
let ageAnanya = 22;
let ageIshita = 20;
console.log("Ananya's Age:", ageAnanya); // 22
console.log("Ishita's Age:", ageIshita); // 20
Here, the = operator assigns numeric values to the variables.
JavaScript offers operators that combine arithmetic operations with assignment. These operators update the variable in place without requiring you to repeat the variable name.
| Operator | Description | Example |
|---|---|---|
+= |
Addition assignment | x += 5 → x = x + 5 |
-= |
Subtraction assignment | x -= 3 → x = x - 3 |
*= |
Multiplication assignment | x *= 2 → x = x * 2 |
/= |
Division assignment | x /= 4 → x = x / 4 |
%= |
Modulus assignment | x %= 3 → x = x % 3 |
**= |
Exponentiation assignment | x **= 2 → x = x ** 2 |
These operators work with numbers, strings, arrays, and objects in meaningful ways.
+=)The addition assignment operator += adds a value to a variable and updates it.
let ageSanya = 21;
ageSanya += 2; // Equivalent to ageSanya = ageSanya + 2
console.log("Sanya's new age:", ageSanya); // 23
It can also be used to concatenate strings:
let greeting = "Hello";
greeting += " Mira";
console.log(greeting); // Hello Mira
-=)The subtraction assignment operator -= subtracts a value from a variable and updates it.
let ageDiya = 25;
ageDiya -= 3; // Equivalent to ageDiya = ageDiya - 3
console.log("Diya's new age:", ageDiya); // 22
This is useful in situations such as reducing scores, deducting balances, or calculating differences.
*=)The multiplication assignment operator *= multiplies the current value of a variable by a specified number and updates the variable.
let priceBook = 250;
priceBook *= 2; // Equivalent to priceBook = priceBook * 2
console.log("Price of 2 books:", priceBook); // 500
It is often used for scaling values or calculating totals in bulk.
/=)The division assignment operator /= divides the current value of a variable by a specified number and updates it.
let totalMarks = 480;
totalMarks /= 4; // Equivalent to totalMarks = totalMarks / 4
console.log("Marks per subject:", totalMarks); // 120
Be careful with division by zero, as it returns Infinity in JavaScript.
%=)The modulus assignment operator %= calculates the remainder of a division and assigns it to the variable.
let ageRiya = 23;
ageRiya %= 5; // Equivalent to ageRiya = ageRiya % 5
console.log("Riya's age modulo 5:", ageRiya); // 3
This is often used to check even/odd numbers or cyclic conditions.
**=)The exponentiation assignment operator **= raises a variable to the power of a number and updates it.
let base = 3;
base **= 2; // Equivalent to base = base ** 2
console.log("3 squared:", base); // 9
This is useful for calculations in finance, physics, or any exponential growth models.
Assignment operators can also modify arrays and objects.
let girls = ["Ananya", "Ishita"];
girls[0] += " Sharma"; // Update the first element
console.log(girls); // ["Ananya Sharma", "Ishita"]
const girl = { name: "Mira", age: 21 };
girl.age += 2; // Increment age property
console.log(girl); // { name: "Mira", age: 23 }
These examples show how assignment operators help manage dynamic data efficiently.
let ageAnanya = 22;
let ageIshita = 20;
ageAnanya += ageIshita;
console.log("Combined Age:", ageAnanya); // 42
let priceBook = 250;
let pricePen = 50;
priceBook += pricePen;
console.log("Updated Book Price:", priceBook); // 300
let scoreSanya = 10;
scoreSanya += 5;
scoreSanya -= 2;
console.log("Sanya's Score:", scoreSanya); // 13
let ageMira = 24;
ageMira %= 7;
console.log("Mira's age modulo 7:", ageMira); // 3
let totalPoints = 0;
for (let i = 1; i <= 5; i++) {
totalPoints += i;
}
console.log("Total Points:", totalPoints); // 15
Using combined assignment operators on uninitialized variables.
Confusing += with = and forgetting the arithmetic step.
Attempting to reassign a const variable.
Using assignment operators incorrectly on non-numeric types without conversion.
Always initialize variables before using combined assignment operators.
Use let for variables that will be updated and const for constants.
Ensure consistent data types for arithmetic operations.
Use descriptive variable names for readability.
Test calculations with sample inputs to verify correctness.
Assignment operators are widely used in programming, including:
Updating scores in games or quizzes
Calculating totals, averages, or balances in financial apps
Updating object properties dynamically
Performing iterative calculations in loops
Concatenating strings to build names, messages, or data dynamically
JavaScript assignment operators allow variables to be updated efficiently. They include simple assignment =, addition +=, subtraction -=, multiplication *=, division /=, modulus %= and exponentiation **=. Mastering these operators helps write concise, readable, and maintainable code. Using assignment operators with numbers, strings, arrays, and objects enables practical problem-solving in real-world applications.
Q1. How do you assign the value 100 to a variable named score using the assignment operator?
Q2. How do you increase a variable points by 10 using the += assignment operator?
Q3. How do you reduce the value of counter = 20 by 5 using the -= operator?
Q4. How do you multiply a variable price = 50 by 2 using the *= operator?
Q5. How do you divide a variable total = 40 by 4 using the /= operator?
Q6. How do you use %= to store the remainder of 27 % 4 in variable r?
Q7. How do you write an expression to raise base = 2 to the power of 3 using **= operator?
Q8. How do you assign the string "World" to a variable greeting and then append " Hello" to it using +=?
Q9. How do you show with code that x += y is the same as x = x + y?
Q10. How do you update a variable z = 100 to half its value using assignment operators only?
Finished learning? Play this simple quiz to reinforce what you just studied.
JS Basics
JS Variables & Operators
JS Data Types & Conversion
JS Numbers & Math
JS Strings
JS Dates
JS Arrays
JS Control Flow
JS Loops & Iteration
JS Functions
JS Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts
