JS Logical Questions

Non-mutating methods return a new array or value without modifying the original
array.

The slice() method returns a shallow copy of a portion of the array.

The map() method creates a new array by applying a function to each element.
The filter() method returns a new array with elements that satisfy a specific condition.
The concat() method merges arrays into a new one without altering the originals.
The reduce() method reduces the array to a single value using a reducer function.
The flat() method flattens nested arrays into a single-level array.
The join() method converts all array elements into a string with a chosen separator.
The toSorted() method returns a sorted shallow copy of the array (introduced in
ES2023).
The toReversed() method returns a reversed shallow copy of the array (ES2023).
The toSpliced() method returns a new array with elements added or removed like
splice() but without mutating the original (ES2023).

Mutating methods directly change the original array.

The splice() method adds or removes elements in place and returns the removed
items.
The push() method adds one or more elements to the end of the array.
The pop() method removes and returns the last element of the array.
The shift() method removes and returns the first element.
The unshift() method adds one or more elements to the beginning of the array.
The sort() method sorts the elements of the array in place.
The reverse() method reverses the array in place.
The fill() method replaces elements in a specified range with a static value.
The copyWithin() method copies part of the array to another location within the
same array.

JSON methods are used for serialization and deep copying.

JSON.stringify() converts a JavaScript object into a JSON string.

JSON.parse() converts a JSON string back into a JavaScript object.
✅ const
●​ ❌ Reassignment: Not allowed (you can't reassign the variable to a new
value).​

●​ ✅ Modify Properties: Allowed (object properties can be changed).​

●​ ✅ Add New Properties: Allowed (you can add new keys to the object).​

●​ ✅ Delete Properties: Allowed (you can delete keys from the object).​

✅ Object.freeze()
●​ ✅ Reassignment: Allowed (you can reassign the variable, but not mutate
the object itself).​

●​ ❌ Modify Properties: Not allowed (object values cannot be changed).​

●​ ❌ Add New Properties: Not allowed (no new keys can be added).​

●​ ❌ Delete Properties: Not allowed (existing keys cannot be deleted).​

✅ Object.seal()
●​ ✅ Reassignment: Allowed (you can reassign the variable).​
●​ ✅ Modify Properties: Allowed (you can update existing property values).​

●​ ❌ Add New Properties: Not allowed (cannot add new keys).​

●​ ❌ Delete Properties: Not allowed (cannot delete existing keys).​

OR Operator

In JavaScript, the “OR” operator evaluates the values from left to right and returns the
first truthy value. If none of the values are truthy, the “OR” operator will return the last
operand.​
​
let x = 'Hello' || false; // x is equal to 'Hello' (first truthy value)

let y = false || 'Yes' || 1; // y is equal to 'Yes' (first truthy value)

let z = false || undefined || 0; // since all are false, z is equal to 0 (the last value)

AND Operator​
​
In JavaScript, the “AND” operator evaluates the values from left to right and returns
the first falsy value. If all the operands are true, the “AND” operator will return the last
operand.​
​
let x = 'Hello' && false; // x is equal to 'false' (first falsy value)

let y = 0 && 'Yes' && true; // y is equal to 0 (first falsy value)

let z = true && 'Hello' && 10; // since all are truthy, z is equal to 10 (the last value)

Function vs Component (React)

🔹 Function
●​ 🎯 Purpose: Performs logic, calculations, or handles data.​
●​ 🔁 Return Value: Can return any data type like number, string, object, etc.​

●​ 🔧 Usage: Called directly like add(2, 3).​

●​ 🚫 Hooks: Cannot use React hooks like useState or useEffect.​

●​ ❌ Re-render on State Change: Does not trigger a UI re-render.​

●​ ❌ Lifecycle: No concept of lifecycle methods.​

●​ ⚡ Side Effects: Executes immediately when called.​

🔹 Component (React)
●​ 🎯 Purpose: Renders UI and manages state in React.​
●​ 🔁 Return Value: Returns JSX (React elements).​

●​ 🔧 Usage: Used in JSX like <Button label="Click" />.​

●​ ✅ Hooks: Can use hooks like useState, useEffect, etc.​

●​ ✅ Re-render on State Change: Automatically re-renders when state or props

change.​

●​ 🔄 Lifecycle: Can mimic lifecycle behavior using useEffect.​

●​ 🎯 Side Effects: Controlled by React and executed during render cycles.​

What happens if you await inside a forEach()?

Array.prototype.forEach() is not async/await aware. It doesn't wait for the await to

resolve and will fire all iterations immediately, leading to unexpected behavior.

Why?

●​ forEach doesn’t handle promises returned from the callback.​

●​ The main thread doesn’t wait for await to finish inside the loop.

Type in JS :​
In JavaScript, type generally refers to the type of value a variable holds. JavaScript is
a dynamically typed language, meaning variables are not bound to a specific type,
and the type can change during runtime.

Primitive Types

These are immutable and represent simple data types.

Behind the Scenes

Primitive values are stored in a call stack or a fixed memory location. When you
attempt to "change" a primitive value:
●​ The original value remains intact in memory.
●​ A new value is computed and stored in a different memory location.

Example-

let a = 10;

a = 20;

How Reassignment Works in JavaScript with Primitives

1.​ Initial Assignment: When you assign let a = 10;, the value 10 is stored in
memory, and the variable a is a reference (or pointer) to that memory location.
2.​ Reassignment: When you later do a = 20;, JavaScript doesn't overwrite the
original value (10). Instead:
○​ A new memory location is allocated for the value 20.
○​ The variable a is updated to reference the new memory location.
○​ The original value 10 remains in memory until it is garbage collected (if
no other variable references it).

Types are:

1.​ String: Represents text.

2.​ Number: Represents both integers and floating-point numbers.
3.​ Boolean: Represents true or false.
4.​Undefined: A variable that has been declared but not assigned a value.

Example: let x; // undefined.

5. Null: Represents an explicitly empty value.

Example: let y = null;

6. Symbol (ES6): Used to create unique identifiers.

It is a unique and immutable value, often used as a key for object properties to avoid
name collisions.

Example :

const sym1 = Symbol("unique");

const sym2 = Symbol("unique");

console.log(sym1 === sym2); // false (every Symbol is unique)

7. BigInt (ES2020): Used for arbitrarily large integers.

Example:let bigNumber = 12345675678901234567890n;

Non-Primitive Types (Objects)

These are mutable and can hold collections of data or more complex entities:

1.​ Object: A collection of key-value pairs.​

Example:let person = { name: "John", age: 30 };
2.​Array: A list of values (ordered collection).

In JavaScript, arrays are technically a type of object. This happens because

arrays inherit from the base object type in JavaScript.

Arrays Work Internally: arrays in JavaScript are objects where:

○​ Indexes are keys (numeric keys stored as strings).

○​ Values are the elements stored at those indexes.

How to verify the object is array : Array.isArray(), instanceof Array and

Object.prototype.toString

3. Function: A callable object.

Example: function greet() { return "Hello!"; }

4. Date, RegExp, Map, Set, etc.: Special types of objects.

What is the This Keyboard?

In JavaScript, the this keyword refers to the context in which a function is executed
— it represents the object that is currently calling the function.