JavaScript Tutorial

JavaScript Assignment

Put a value in a name with =. Shortcuts like += change the value that is already there.

The equals sign stores

= is not a claim that two things are equal. It copies the value on the right into the name on the left. After let total = 0;, the name total holds 0. Aftertotal = 15;, it holds 15. The old value is gone.

The right-hand side runs first. let area = width * height; multiplies, then stores the product. You can assign a literal, an expression, or another variable.

Example

let total = 0;
console.log(total);
total = 15;
console.log(total);

const width = 8;
const height = 3;
const area = width * height;
console.log(area);

Compound assignment

A shortcut operator updates a name using its current value. n += 2 meansn = n + 2. The same pattern works for the other arithmetic operators.

ShortcutMeans
n += 2n = n + 2
n -= 2n = n - 2
n *= 2n = n * 2
n /= 2n = n / 2
n %= 2n = n % 2

Example

let score = 10;
score += 5;
console.log(score);
score *= 2;
console.log(score);
score -= 4;
console.log(score);
score /= 2;
console.log(score);

Start at 10. Add 5 to get 15. Multiply by 2 to get 30. Subtract 4 to get 26. Divide by 2 to get 13.

Click Try it in JavaScript under the example. StudyGrid opens/javascript/try,.

Strings and +=

+= also concatenates when the current value is a string. That is how you build a line of text in a loop without repeating the name on both sides.

Example

let message = "Hello";
message += ", ";
message += "Mina";
message += ".";
console.log(message);

let list = "";
list += "apples\n";
list += "bread\n";
list += "milk";
console.log(list);

message becomes "Hello, Mina.". For a longer template with variables in the middle, a later chapter uses backticks instead of a chain of +=.

Assignment is not comparison

= writes. === asks. Mixing them is the classic bug in an if test.if (role = "admin") assigns "admin" to role and then treats that string as true — the condition always passes. The test you meant is if (role === "admin").

If a condition looks like it should sometimes fail and it never does, search for a single =where you wanted ===.

Increment vs += 1

n++ and n += 1 both add one when they stand as their own statement. Use+= when the change is not one, or when you want the line to look like math:total += price, tax += rate * price. Use ++ for a counter that ticks by one: a loop index, a click count, a remaining life.

n++ needs let. A const name cannot be reassigned, so it cannot be incremented either.

Chaining assignment

a = b = 0 assigns 0 to b, then assigns that same value toa. It works. It is also easy to misread. This tutorial assigns one name per line.

Example

let x = 0;
let y = 0;
y = 4;
x = y;
console.log(x);
console.log(y);

x = 9;
console.log(x);
console.log(y);

After x = y, both names hold 4. They are two boxes with the same number, not two labels on one box. Changing x later does not change y. (Objects share a reference — that is a later chapter.)

What you can assign

The right-hand side can be a number, a string, a boolean, an object, an array, a function, ornull. JavaScript does not lock a name to one type. let value = 3; thenvalue = "three"; is allowed. It is also how a later reader loses track of what the name holds. Keep a name to one kind of value unless you have a reason not to.

Next: the types those values can have, and how typeof reports them.

FAQ: JavaScript Assignment

Common questions about this page.

What is the StudyGrid JavaScript tutorial?

The StudyGrid JavaScript tutorial is a full beginner track: variables, functions, arrays, if/else, the DOM, events, storage, and fetch. Each chapter has copy-and-run examples.

Should I run javascript assignment examples locally for better learning?

Yes. Use the browser editor on StudyGrid for a quick check, then Download the example and run it on your computer. Local runs show real errors and the real toolchain, which is one of the fastest ways to learn javascript assignment in this JavaScript JavaScript lesson (JavaScript Assignment).

Is the JavaScript editor the same as Try Python?

No. Try JavaScript is a live page plus a console at /javascript/try. Try Python stays at /try. JavaScript lessons never open the Python editor.

Do I need to install anything to learn JavaScript?

No. Open a chapter, click Try it in JavaScript, and the page and console update in the browser.

Where should I start the JavaScript tutorial?

Start at JavaScript Intro, then Where To, Output, and Syntax. After variables and functions, continue to the DOM and events. Use Next at the bottom of each chapter.

Is the JavaScript tutorial free?

Yes. The JavaScript studio on StudyGrid (studygrid.in) is free: dashboard, chapters, and the live editor.