JS Guide
HomeQuestionsTopicsCompaniesResources
BookmarksSearch

Built for developers preparing for JavaScript, React & TypeScript interviews.

ResourcesQuestionsSupport
HomeQuestionsSearchProgress
HomeTopicsjavascriptOperators
PrevNext
javascript
beginner
14 min read

Operators

conditional
equality
fundamentals
jsx
logical-operators
nullish-coalescing
operators
optional-chaining
ternary
type-coercion

== performs type coercion before comparison (loose equality), while === compares both value and type without coercion (strict equality). The ternary operator is an expression that returns a value, unlike if-else which is a statement.

Key Points

1Loose Equality (==)

Coerces types before comparing — 1 == '1' is true, null == undefined is true; complex rules make it error-prone

2Strict Equality (===)

Compares value and type without coercion — always preferred; only exception is == null to check null/undefined

3Ternary Operator

condition ? ifTrue : ifFalse — an expression that returns a value, usable in assignments and JSX unlike if-else

4Logical Operators

&& returns first falsy, || returns first truthy, ?? returns first non-nullish, ?. safely chains null/undefined access

5Expression vs Statement

Ternary and logical operators are expressions (produce values); if-else is a statement — critical distinction for JSX

What You'll Learn

  • Understand the difference between == and === in JavaScript
  • Know when to use the ternary operator vs if-else
  • Understand logical operators (&&, ||, ??, ?.) and short-circuit evaluation

Deep Dive

JavaScript operators are fundamental to writing expressions and controlling program flow. Two of the most commonly tested topics in interviews are equality comparisons and the ternary operator.

== (Loose Equality)

  • Performs type coercion before comparing: if the operands are different types, JavaScript converts one or both to a common type.
  • 1 == '1' → true (string '1' is coerced to number 1).
  • 0 == false → true (false is coerced to 0).
  • '' == false → true (both coerce to 0).
  • null == undefined → true (special rule in the spec).
  • null == 0 → false (null only equals undefined and null with ==).
  • The coercion rules are complex and hard to memorize, which is why == is generally avoided.

=== (Strict Equality)

  • Compares both value and type with no coercion.
  • 1 === '1' → false (different types).
  • 0 === false → false (different types).
  • null === undefined → false (different types).
  • Always prefer === unless you specifically want coercion. The only common exception is value == null which conveniently checks for both null and undefined in one expression.

Ternary Operator

  • Syntax: condition ? expressionIfTrue : expressionIfFalse.
  • Unlike if-else, the ternary is an expression — it produces and returns a value. This makes it usable in variable assignments, return statements, template literals, and JSX.
  • const status = age >= 18 ? 'adult' : 'minor'; — not possible with if-else in a single expression.
  • In React JSX: {isLoggedIn ? <Dashboard /> : <Login />} — ternary is the standard pattern for conditional rendering because JSX requires expressions, not statements.
  • Avoid nesting ternaries — a ? b : c ? d : e is hard to read. Use if-else or extract into a function for complex conditions.

Logical Operators

  • && (AND): returns the first falsy value, or the last value if all are truthy. Used for short-circuit evaluation: user && user.name.
  • || (OR): returns the first truthy value, or the last value if all are falsy. Used for default values: name || 'Anonymous'.
  • ?? (Nullish Coalescing): returns the right operand if the left is null or undefined — unlike ||, it treats 0 and '' as valid values.
  • ?. (Optional Chaining): returns undefined if a reference is null/undefined instead of throwing: user?.address?.city.

Key Interview Distinction: Expression vs Statement The ternary operator is an expression (produces a value). if-else is a statement (performs an action). This distinction matters in JSX, where only expressions are allowed inside {}. This is why React uses ternary for inline conditionals and && for conditional rendering, not if-else.

Fun Fact

JavaScript's == operator follows the 'Abstract Equality Comparison Algorithm,' which is 12 steps long in the specification. Douglas Crockford called == 'the evil twin' of === in his influential 'JavaScript: The Good Parts' talk, and his recommendation to always use === became one of the most universally followed JavaScript best practices.

Learn These First

Type Coercion

beginner

Continue Learning

Type Coercion

beginner

Practice What You Learned

What is the difference between == and === in JavaScript?
junior
operators
== performs type coercion before comparison (loose equality), while === compares both value and type without coercion (strict equality).
What is the ternary operator and how does it differ from an if-else statement?
junior
operators
The ternary operator (condition ? valueIfTrue : valueIfFalse) is a concise one-line alternative to if-else that returns a value. Unlike if-else, it's an expression that can be used in assignments, return statements, and JSX.
Previous
Objects & Copying
Next
Currying & Partial Application
PrevNext