JavaScript Operators & Type Conversion

What is an operator?

An operator is a symbol or keyword that performs an operation on one or more values. The values an operator works with are called operands.

10 + 5
score >= 40
isLoggedIn && hasAccess

Arithmetic operators

Arithmetic operators numeric calculations ke liye use hote hain.

console.log(10 + 3); // 13
console.log(10 - 3); // 7
console.log(10 * 3); // 30
console.log(10 / 2); // 5
console.log(10 % 3); // 1
console.log(2 ** 3); // 8

• + addition.
• - subtraction.
• * multiplication.
• / division.
• % remainder.
• ** exponentiation.

Remainder operator

The remainder operator is useful for patterns such as checking whether an integer is even.

const value = 12;
console.log(value % 2); // 0

If an integer divided by 2 leaves remainder 0, it is even.

Increment and decrement

++ increases a numeric variable by one and -- decreases it by one.

let count = 5;
count++;
console.log(count); // 6

count--;
console.log(count); // 5

Prefix and postfix forms can produce different expression results. Beginners should avoid clever combinations and keep updates on clear separate lines.

Assignment operators

The basic assignment operator is =. Compound assignment combines an operation with assignment.

let score = 50;
score += 10; // score = score + 10
score -= 5;
score *= 2;
score /= 5;
score %= 6;

console.log(score);

The + operator with strings

The + operator can add numbers, but if string concatenation is involved it can join text instead.

console.log(10 + 5);       // 15
console.log("10" + 5);     // "105"
console.log("Broun" + "Stack"); // "BrounStack"

Comparison operators

Comparison operators usually produce a boolean value: true or false.

console.log(10 > 5);   // true
console.log(10 < 5);   // false
console.log(10 >= 10); // true
console.log(8 <= 7);   // false

Strict equality and inequality

=== checks equality without performing type coercion. !== checks strict inequality.

console.log(5 === 5);   // true
console.log(5 === "5"); // false
console.log(5 !== "5"); // true

Loose equality

== and != can convert operand types before comparison. This can create results that are less obvious to beginners.

console.log(5 == "5");  // true
console.log(5 === "5"); // false

console.log(false == 0);  // true
console.log(false === 0); // false

Loose equality has defined rules, but strict equality usually makes intent easier to understand.

Logical operators

Logical operators combine or invert conditions.

const isLoggedIn = true;
const hasCourse = true;

console.log(isLoggedIn && hasCourse); // true
console.log(isLoggedIn || hasCourse); // true
console.log(!isLoggedIn);             // false

• && — logical AND.
• || — logical OR.
• ! — logical NOT.

Short-circuit behavior

&& and || do not always return booleans. They evaluate operands and can return one of the original values.

console.log("ready" && "start"); // "start"
console.log("" || "fallback");    // "fallback"

This behavior is useful in real code, but understand truthy/falsy conversion before using it heavily.

Nullish coalescing operator

?? returns the right-hand value only when the left-hand value is null or undefined.

const savedName = null;
const displayName = savedName ?? "Guest";

console.log(displayName); // "Guest"

Unlike ||, values such as 0 and an empty string are not treated as missing by ??.

Operator precedence

Some operators are evaluated before others. Multiplication normally happens before addition.

console.log(2 + 3 * 4);   // 14
console.log((2 + 3) * 4); // 20

What is type conversion?

Type conversion changes a value from one data type to another. Conversion can be explicit, where you ask for it, or implicit, where JavaScript performs coercion during an operation.

Convert to Number

Number() attempts to convert a value to the number type.

console.log(Number("42"));      // 42
console.log(Number("3.5"));     // 3.5
console.log(Number(""));        // 0
console.log(Number(null));      // 0
console.log(Number(undefined)); // NaN
console.log(Number("hello"));   // NaN

After uncertain numeric conversion, Number.isNaN() can help detect an actual NaN result.

const amount = Number("hello");
console.log(Number.isNaN(amount)); // true

parseInt() and parseFloat()

parseInt() and parseFloat() parse numeric text from the beginning of a string. Their behavior differs from Number().

console.log(parseInt("42px", 10)); // 42
console.log(parseFloat("3.14rem")); // 3.14
console.log(Number("42px"));        // NaN

Use the conversion method that matches your data instead of treating them as interchangeable.

Convert to String

String() converts many values to text.

console.log(String(42));        // "42"
console.log(String(true));      // "true"
console.log(String(null));      // "null"
console.log(String(undefined)); // "undefined"

Convert to Boolean

Boolean() converts a value according to JavaScript truthiness rules.

console.log(Boolean(1));       // true
console.log(Boolean(0));       // false
console.log(Boolean("hello")); // true
console.log(Boolean(""));      // false
console.log(Boolean(null));    // false

Truthy and falsy values

In boolean contexts, some values behave like false; most other values behave like true.

Common falsy values include false, 0, -0, 0n, an empty string, null, undefined and NaN.

console.log(Boolean("false")); // true
console.log(Boolean("0"));     // true
console.log(Boolean([]));      // true
console.log(Boolean({}));      // true

Implicit type coercion

JavaScript sometimes converts values automatically while evaluating an expression.

console.log("5" + 2); // "52"
console.log("5" - 2); // 3
console.log("5" * 2); // 10
console.log(true + 1); // 2

The + operator is especially important because it also performs string concatenation.

Why this matters in forms

Many form controls expose entered values as strings. Numeric-looking input may therefore need explicit conversion before arithmetic.

const firstInput = "10";
const secondInput = "5";

console.log(firstInput + secondInput); // "105"
console.log(Number(firstInput) + Number(secondInput)); // 15

We will apply this pattern to real forms later in the course.

Number and BigInt do not mix directly

Regular number and bigint values generally cannot be mixed directly in arithmetic.

const big = 10n;
const normal = 5;

// big + normal; // TypeError

Convert deliberately only when that conversion is valid for your use case.

Beginner best practices

• Comparison ke liye default === aur !== rakho.
• User/form values par numeric arithmetic se pehle type verify ya convert karo.
• Conversion explicit rakho when intent matters.
• + ke string-concatenation behavior ko remember karo.
• Complex expressions me parentheses use karo.
• Number.isNaN() se failed numeric conversion inspect karo.
• Truthy/falsy shortcuts tab use karo jab behavior clearly samajh aaye.

Common beginner mistakes

• = ko equality comparison samajhna.
• == aur === ko exactly same samajhna.
• "10" + 5 ka result 15 expect karna.
• Boolean("false") ko false expect karna.
• Number("") ka result NaN expect karna.
• NaN === NaN se NaN check karna instead of Number.isNaN().
• Operator precedence guess karna without parentheses.
• Regular numbers aur BigInt directly mix karna.

Chapter checklist

• Arithmetic aur assignment operators use kar sakte ho?
• Comparison ka result boolean hota hai ye clear hai?
• === vs == difference samajh aaya?
• &&, ||, ! aur ?? ka basic role clear hai?
• Number(), String() aur Boolean() use kar sakte ho?
• Truthy/falsy aur implicit coercion ke common surprises recognize kar sakte ho?