Master JavaScript Operators: From Identifiers to Advanced Usage

This article explains JavaScript identifiers and systematically breaks down every type of operator—from unary and boolean to relational, equality, conditional, assignment, comma, and bitwise—illustrating each with clear definitions, code examples, and visual diagrams for front‑end developers.

Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Tencent IMWeb Frontend Team
Master JavaScript Operators: From Identifiers to Advanced Usage

The article begins by asking what operators and identifiers are in JavaScript, then defines an identifier as the name of a variable, function, or object property and lists the naming rules: the first character must be a letter, underscore, or dollar sign, and subsequent characters may also include digits.

Identifier: the name of a variable, function, or object property.

It then identifies the operators present in a sample code snippet (e.g., arr total len sum i ) and notes that variable and function names themselves are identifiers, not operators.

Operators are categorized as follows:

Unary Operators

Operators that act on a single operand, such as ++num, num--, --num, and sign conversion +s2, -s1. The article shows how different data types behave when incremented, referencing the ECMA specification.

Boolean Operators

Three boolean operators: !, &&, ||. It explains truthy/falsy values and demonstrates short‑circuit evaluation with examples.

Multiplicative Operators

The operators *, /, and % work on numeric values, and non‑numeric operands are first coerced to numbers according to the same rules described for unary operators.

Additive Operators

If both operands are numbers, normal addition occurs.

If either operand is NaN, the result is NaN.

If no operand is a string, both are converted to numbers before addition.

If one operand is a string, the other is converted to a string (using toString() or String()) and concatenation is performed.

Relational Operators

Includes <, >, <=, >=. When operands are strings, comparison is based on character code values; when one operand is a number, the other is coerced to a number; when an operand is an object, valueOf() or toString() is used before comparison.

Equality Operators

Loose equality ( ==) and inequality ( !=) perform type conversion before comparison, following rules such as converting booleans to numbers, strings to numbers, and objects via valueOf() / toString(). Special cases include null == undefined (true) and any comparison with NaN yielding false.

Strict Equality Operators

Strict equality ( ===) and inequality ( !==) do not perform type conversion; values must be of the same type to be considered equal.

Conditional Operator

Uses ? and : to return one of two expressions based on a boolean condition.

Assignment Operators

Assigns a value to a variable ( var num = 2) and can combine with other operators, e.g., num += 10 (equivalent to num = num + 10).

Comma Operator

Allows multiple expressions in a single statement, evaluating each left‑to‑right and returning the last value, e.g., var num = (num1++, num3++, num3) results in num being 4.

Bitwise Operators

Briefly mentions bitwise operators, noting they are rarely used in JavaScript and are more relevant to low‑level languages like C.

The article concludes by encouraging front‑end developers to experiment with these operators to deepen their understanding.

frontendprogrammingECMAScriptOperatorsIdentifiers
Tencent IMWeb Frontend Team
Written by

Tencent IMWeb Frontend Team

IMWeb Frontend Community gathering frontend development enthusiasts. Follow us for refined live courses by top experts, cutting‑edge technical posts, and to sharpen your frontend skills.

0 followers
Reader feedback

How this landed with the community

Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.