Scribd
Upload
3 views4 pages

Operators+In JavaScript

The document provides an overview of various operators in JavaScript, including arithmetic, assignment, comparison, logical, bitwise, string, ternary, unary, relational, and other operators. It specifically highlights the Nullish Coalescing Operator (`??`), which returns its right-hand operand when the left is `null` or `undefined`, and contrasts it with the logical OR (`||`) operator. Additionally, it covers browser support for these operators and their practical usage through examples.

Uploaded by

nrisimhaleo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
3 views4 pages

Operators+In JavaScript

The document provides an overview of various operators in JavaScript, including arithmetic, assignment, comparison, logical, bitwise, string, ternary, unary, relational, and other operators. It specifically highlights the Nullish Coalescing Operator (`??`), which returns its right-hand operand when the left is `null` or `undefined`, and contrasts it with the logical OR (`||`) operator. Additionally, it covers browser support for these operators and their practical usage through examples.

Uploaded by

nrisimhaleo
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 4

Operators in JavaScript

---

1. Arithmetic Operators

Used for mathematical operations on numbers:

`+` (Addition)
`-` (Subtraction)
`*` (Multiplication)
`/` (Division)
`%` (Remainder/Modulus)
`**` (Exponentiation)

`++` (Increment)
`--` (Decrement)

Eg:

let x = 10 % 3; // Returns 1 (remainder)


---

2. Assignment Operators
Assign values to variables:
`=` (Simple assignment)
`+=` (Add and assign)
`-=` (Subtract and assign)
`*=` (Multiply and assign)
`/=` (Divide and assign)
`%=` (Modulus and assign)
`**=` (Exponentiation and assign)

Eg:

let y = 5;
y **= 2; // y = 25
---

### **3. Comparison Operators or Relational operators

Compare values and return a boolean (`true`/`false`):


`==` (Loose equality)
`===` (Strict equality)
`!=` (Loose inequality)
`!==` (Strict inequality)
`>` (Greater than)
`<` (Less than)
`>=` (Greater than or equal)
`<=` (Less than or equal)

Eg:

"5" == 5; // true (type coercion)


"5" === 5; // false (strict check)
---

4. Logical Operators
Used with boolean values:
`&&` (Logical AND)
`||` (Logical OR)
`!` (Logical NOT)
`??` (Nullish Coalescing)

Eg:

true && false; // false

---

5. Bitwise Operators

Perform operations on 32-bit binary representations:

`&` (AND)
`|` (OR)
`^` (XOR)
`~` (NOT)
`<<` (Left shift)
`>>` (Right shift)
`>>>` (Zero-fill right shift)

Eg:

5 & 1; // 1 (0101 & 0001 = 0001)

---

6. String Operators
`+` (Concatenation)
`+=` (Concatenate and assign)

Eg:

"Hello" + " World"; // "Hello World"

---

### **7. Ternary (Conditional) Operator**


- `condition ? expr1 : expr2`

Eg:

let age = 20;


let status = (age >= 18) ? "Adult" : "Minor"; // "Adult"

---

8. Unary Operators
Operate on a single operand:
`typeof` (Returns variable type)
`void` (Discards expression return value)
`delete` (Removes object properties)
`+` (Converts to number)
`-` (Negates a number)

Eg:
typeof 42; // "number"
---

9. Relational Operators
- `in` (Checks if property exists in an object)
- `instanceof` (Checks object type)

Eg:

"length" in []; // true

---

10. Other Operators


- `...` (Spread/Rest)
- `,` (Comma operator)
- `new` (Creates object instance)
- `super` (Calls parent class methods)

Eg:
const arr = [...[1, 2], 3]; // [1, 2, 3]
-----------------------------------------------------------------------------------
--
Nullish Coalescing Operator (`??`) in JavaScript
-----------------------------------------------------------------------
The `??` operator (Nullish Coalescing) is a logical operator that returns its
right-hand operand when the left-hand operand is `null` or `undefined`. Otherwise,
it returns the left-hand operand.

#### **Key Points**


1. Purpose:
Provide a default value for `null` or `undefined` (but not for other falsy values
like `0`, `""`, or `false`).
2. Introduced in: ES2020 (ECMAScript 2020).
3.Alternative to: The logical OR (`||`) operator, but with stricter checks.

Syntax:

leftOperand ?? rightOperand

- If `leftOperand` is `null` or `undefined`, return `rightOperand`.


- Otherwise, return `leftOperand`.

---
Examples

1. Basic Usage

let username = null;


let defaultName = "Guest";

console.log(username ?? defaultName); // "Guest" (since username is null)

2. Difference Between `??` and `||`

The `||` operator returns the right-hand operand for any falsy value (`0`, `""`,
`false`, `null`, `undefined`, `NaN`), while `??` only cares about `null` or
`undefined`.
let count = 0;
let defaultValue = 10;

console.log(count || defaultValue); // 10 (0 is falsy)


console.log(count ?? defaultValue); // 0 (0 is not null/undefined)

3. Chaining with `??`


let userInput = undefined;
let fallback1 = null;
let fallback2 = "Final Value";

console.log(userInput ?? fallback1 ?? fallback2); // "Final Value"


Steps:
userInput (undefined) → fallback1 (null) → fallback2 ("Final Value")

4. Combining with Optional Chaining (`?.`)

const user = { name: "Alice", age: 25 };

console.log(user.address?.city ?? "City not set"); // "City not set"

// If `user.address` or `user.address.city` is null/undefined, use fallback.


---

Browser Support
- Supported in all modern browsers (Chrome, Firefox, Edge, Safari) and Node.js 14+.
- Not supported in Internet Explorer.

---

Summary:

`??` is ideal for providing fallbacks only when a value is `null` or `undefined`.
`||` is broader and replaces all falsy values, which may not always be desired.

You might also like