JavaScript-intervew-questions

** Let's start:**

Q1: Can you explain the difference between `var`, `let`, and `const` in JavaScript?

Answer:

var is function-scoped, meaning it is accessible throughout the function where it's declared. It can also be re-declared and re-assigned, but it leads to issues like hoisting and unexpected behaviors due to its scope.
let is block-scoped, so it's only accessible within the block where it is declared (e.g., within an if statement or loop). You can re-assign let, but not re-declare it within the same scope.
In JavaScript, var can be re-declared within the same scope, which means you can declare the same variable multiple times without getting an error. Here's an example:

var name = "Prashant";
var name = "Kumar";  // re-declaring 'name'
console.log(name);    // Output: "Kumar"

In this case, var allows you to declare the name variable twice in the same scope without throwing an error, and it simply overwrites the previous value.

This is one of the issues with var, as it can lead to unintended behavior, especially in larger codebases, which is why let and const (block-scoped) are preferred for better control.

const is also block-scoped like let, but it cannot be re-assigned after its initial assignment. However, if the const holds an object or array, you can still modify the contents of that object or array.

Q2: Can you explain hoisting in JavaScript, specifically in the context of var, let, and const?

Answer: Sure! Let's break down hoisting in JavaScript and how it works with var, let, and const.

What is Hoisting?

Hoisting is a JavaScript mechanism where variable and function declarations are moved (or "hoisted") to the top of their scope before code execution. This means that you can use variables and functions before they appear in the code, but the behavior varies depending on how they are declared.

In hoisting:

Variable declarations (but not assignments) are hoisted.
Function declarations (entire functions) are hoisted.

However, variables declared with var, let, and const behave differently when hoisted.

Hoisting with `var`

When you declare a variable with var, the declaration is hoisted to the top of the function or global scope, but it is initialized with undefined until the assignment is encountered.
This is why you can reference var variables before they are initialized without getting an error.

Example:

console.log(x);  // Output: undefined
var x = 5;
console.log(x);  // Output: 5

Explanation:

The var declaration is hoisted, but its value is set to undefined until the assignment x = 5 is executed. So, when console.log(x) is called before the assignment, it logs undefined.

Hoisting with `let`

Variables declared with let are also hoisted, but they are not initialized. They remain in the Temporal Dead Zone (TDZ) from the start of the block until they are initialized.
Accessing the variable before initialization results in a ReferenceError.

Example:

console.log(y);  // ReferenceError: Cannot access 'y' before initialization
let y = 10;
console.log(y);  // Output: 10

Explanation:

The let declaration is hoisted, but because the variable is in the TDZ, accessing it before the initialization causes a ReferenceError.

Hoisting with `const`

Variables declared with const behave similarly to let. They are hoisted but remain in the Temporal Dead Zone until they are initialized.
Accessing a const variable before initialization results in a ReferenceError.
Additionally, once initialized, const variables cannot be reassigned.

Example:

console.log(z);  // ReferenceError: Cannot access 'z' before initialization
const z = 15;
console.log(z);  // Output: 15

Explanation:

Just like with let, the const declaration is hoisted, but trying to access z before it’s initialized results in a ReferenceError.

Comparison of `var`, `let`, and `const` Hoisting

Variable Type	Hoisted	Initial Value Before Assignment	TDZ (Temporal Dead Zone)	Can Be Reassigned?
`var`	Yes	`undefined`	No	Yes
`let`	Yes	Not initialized (TDZ)	Yes	Yes
`const`	Yes	Not initialized (TDZ)	Yes	No

Summary:

var is hoisted and initialized with undefined. You can reference it before assignment, but it will give undefined until the actual assignment.
let and const are hoisted but are not initialized. They are in the temporal dead zone (TDZ) and accessing them before the initialization line throws a ReferenceError. const also cannot be reassigned once initialized.

Example Code (to understand all together):

console.log(a);  // undefined (var is hoisted and initialized to undefined)
var a = 5;

console.log(b);  // ReferenceError: Cannot access 'b' before initialization
let b = 10;

console.log(c);  // ReferenceError: Cannot access 'c' before initialization
const c = 15;

In the above code:

var a is hoisted and initialized as undefined before its assignment.
let b and const c are hoisted but are not initialized until the point where their declarations appear in the code, so trying to access them before that results in a ReferenceError.

Q3: What are the differences between var, let, and const in terms of scope, hoisting, and reassignment?

Answer:

Scope:
- var is function-scoped. This means that a var variable is accessible throughout the function or globally if declared outside any function.
- let and const are block-scoped, meaning they are only accessible within the block {} in which they are defined (such as inside loops, if statements, or functions).
Hoisting:
- Variables declared with var are hoisted to the top of their scope and initialized with undefined. This is why you can reference a var variable before its declaration without getting an error, though its value will be undefined until it's assigned.
- let and const are also hoisted, but they are not initialized. Accessing them before their declaration will result in a ReferenceError because they are in the Temporal Dead Zone (TDZ) until the point where they are initialized.
Reassignment:
- var and let can be reassigned after their declaration.
- const cannot be reassigned after its initial assignment. However, if a const is used with an object or array, the properties or elements of the object/array can still be modified, but you cannot reassign the entire object/array itself.

Example to Demonstrate the Differences:

function example() {
    // Scope
    if (true) {
        var x = 1;      // function-scoped
        let y = 2;      // block-scoped
        const z = 3;    // block-scoped
    }
    console.log(x); // 1
    console.log(y); // ReferenceError: y is not defined
    console.log(z); // ReferenceError: z is not defined
}
example();

// Hoisting
console.log(a);  // undefined
var a = 10;

console.log(b);  // ReferenceError: Cannot access 'b' before initialization
let b = 20;

console.log(c);  // ReferenceError: Cannot access 'c' before initialization
const c = 30;

Q4: What are the different data types in JavaScript?

Answer In JavaScript, there are two main categories of data types: primitive and non-primitive (or reference types).

1. Primitive Data Types:

These are the basic data types that are immutable, meaning their values cannot be altered (changed) directly.

Number: Represents both integer and floating-point numbers. Example: 42, 3.14
String: Represents text or sequences of characters. Example: "Hello", 'World'
Boolean: Represents a logical entity with two values: true or false.
Undefined: A variable that has been declared but not assigned a value yet.
Null: Represents the intentional absence of any value.
BigInt: Used for very large integers that exceed the safe integer limit. Example: 123n
Symbol: Used to create unique and immutable values, often used as object keys.

Example with Primitive Types (Immutable):

Primitive data types like number, string, boolean, null, undefined, symbol, and bigInt are immutable. Here's an example:

let greeting = "Hello";
greeting[0] = "J";  // Trying to change the first letter
console.log(greeting);  // Output: "Hello"

Even though we tried to change the first letter of the string "Hello", it didn't change because strings are immutable. Instead, if we want a new string, we have to create a completely new one:

let newGreeting = greeting.replace("H", "J");
console.log(newGreeting);  // Output: "Jello"

Here, the string wasn't modified in place. Instead, a new string "Jello" was created, and the original "Hello" remained unchanged.

In JavaScript, the term immutable means that once a value is created, it cannot be changed or modified directly. If you try to alter (change) an immutable value, a new value is created instead, while the original remains unchanged.

2. Non-Primitive Data Types (Reference Types):

These are mutable and more complex data structures.

Object: A collection of key-value pairs. Example: { name: "Prashant", age: 25 }
Array: A special kind of object used to store ordered lists of values. Example: [1, 2, 3]
Function: A block of code that can be executed when called.
Date: Represents date and time. Example: new Date().

Key Point:

Primitive types are passed by value, while non-primitive types (objects, arrays) are passed by reference.

Example with Non-Primitive Types (Mutable):

Non-primitive types like objects and arrays are mutable, meaning they can be modified:

let person = { name: "Prashant", age: 25 };
person.age = 26;  // Changing the age property
console.log(person);  // Output: { name: "Prashant", age: 26 }

In this case, the person object was directly modified.

In summary, immutable values cannot be changed after they are created, while mutable values (like objects) can be modified.

Let me explain the concepts of pass by value and pass by reference in JavaScript.

1. Pass by Value:

When a variable holding a primitive data type (like number, string, boolean, etc.) is passed to a function or assigned to another variable, only the value is passed or copied. Changes made to this copied value do not affect the original variable.

Example:

let a = 10;
let b = a;  // 'b' is a copy of 'a'
b = 20;     // Changing 'b' won't affect 'a'

console.log(a);  // Output: 10
console.log(b);  // Output: 20

In this example, b gets a copy of a's value. When b is changed, it does not affect the original value of a, because they are stored separately in memory.

2. Pass by Reference:

When a variable holding a non-primitive data type (like objects or arrays) is passed to a function or assigned to another variable, a reference (or memory address) to the original data is passed. This means that both variables point to the same object in memory. Any changes made to the new variable will also affect the original variable.

Example:

let obj1 = { name: "Prashant" };
let obj2 = obj1;  // 'obj2' holds a reference to the same object as 'obj1'
obj2.name = "Kumar";  // Changing 'obj2' affects 'obj1'

console.log(obj1.name);  // Output: "Kumar"
console.log(obj2.name);  // Output: "Kumar"

Here, obj2 holds a reference to the same object in memory as obj1. When you change obj2.name, it also changes obj1.name, because they both point to the same object.

Key Differences:

Pass by value copies the actual value. Changes to one copy do not affect the other.
Pass by reference passes the memory address. Changes to the reference affect the original object or array.

**Q5. What is the difference between == (Equality Check) and === (Strict Equality Check) in JavaScript?

###Answer: In JavaScript, == checks the equality of values, but === checks the equality of both the values and the type of the value. For example:

5 == "5";      // true
5 === "5";   // false

Q6. What is type coercion in JavaScript?

Type coercion in JavaScript is the process where the JavaScript engine automatically or implicitly converts one data type to another in order to perform operations or comparisons. This happens when different types of values (e.g., strings and numbers) are used together.

There are two types of type coercion:

Implicit Coercion: This occurs automatically during operations. JavaScript attempts to convert data types to make them compatible with the operation being performed.

Example:

console.log(5 + "10"); // "510" (number 5 is coerced to a string, and the result is string concatenation)
console.log(5 == "5"); // true (the string "5" is coerced to a number before comparison)

Explicit Coercion: This happens when the developer intentionally converts a value from one type to another using functions like Number(), String(), or Boolean().

Example:

console.log(Number("10"));  // 10 (string is explicitly converted to a number)
console.log(String(123));   // "123" (number is explicitly converted to a string)

Why is it important?

Type coercion allows for flexibility in JavaScript, but it can also lead to unexpected results if you're not aware of how it works. For example:

console.log(true + 2); // 3 (true is coerced to 1)
console.log(false + "test"); // "falsetest" (false is coerced to a string)

Q7. What are JavaScript data types? Can you explain the difference between null and undefined?

###Answer: Data types in JavaScript are a way to categorize data based on the kind of values they hold. JavaScript has two main categories of data types:

Primitive Data Types: These are immutable, meaning their values cannot be changed.
- Number
- String
- Boolean
- Undefined
- Null
- Symbol
- BigInt
Non-Primitive (Reference) Data Types: These are mutable, meaning their values can be changed.
- Object
- Array
- Function
- Date, etc.

Null vs Undefined:

null: Represents the intentional absence of any value. It is used when a variable should be empty or have no value.
- Type: Object (This is a known bug in JavaScript but has been left as is for historical reasons).
undefined: Indicates that a variable has been declared but not yet assigned a value. It is the default value for uninitialized variables.
- Type: undefined

Example:

let x;            // x is declared but not assigned a value, so it's undefined
let y = null;     // y is explicitly assigned the value of null, indicating no value

Q8.How do you convert a variable from one data type to another in JavaScript? Can you provide examples for converting between string, number, and boolean types?

###Answer:

Converting Data Types in JavaScript

Number to String:
- You can convert a number to a string using:
  - String()
  - toString() method
  - Template literals (using backticks)
  - Concatenation with an empty string
- Examples:
```
let num = 5;
let str1 = String(num); // "5"
let str2 = num.toString(); // "5"
let str3 = `${num}`; // "5"
let str4 = num + ''; // "5"
```
String to Number:
- You can convert a string to a number using:
  - Number()
  - parseInt() for integers
  - parseFloat() for floating-point numbers
- Examples:
```
let str = "5";
let num1 = Number(str); // 5
let num2 = parseInt(str); // 5
let num3 = parseFloat("5.5"); // 5.5
```
String to Boolean:
- While JavaScript does not have a direct method for converting strings to booleans, you can evaluate the truthiness of a string:
  - An empty string ("") is falsy, while a non-empty string (like "true") is truthy.
- Example:
```
let str = "true";
let bool = Boolean(str); // true
let emptyStr = "";
let boolEmpty = Boolean(emptyStr); // false
```

Note:

In JavaScript, values are considered truthy or falsy based on their behavior in a boolean context (like conditions in an if statement). Here's a breakdown:

Falsy Values

These values evaluate to false when coerced to a boolean:

false - The boolean value false.
0 - The number zero.
-0 - The negative zero.
"" or '' - An empty string.
null - Represents the absence of a value.
undefined - Indicates that a variable has not been assigned a value.
NaN - Stands for "Not-a-Number", a special value that indicates an invalid number.

Truthy Values

These values evaluate to true when coerced to a boolean:

Any non-zero number (e.g., 1, -1, 3.14)
Any non-empty string (e.g., "hello", "false", "0")
Any object (including arrays and functions)
Any array (e.g., [], [1, 2, 3])
The special value Infinity and -Infinity

Examples

Here’s a quick demonstration of how these values behave in conditions:

// Falsy values
if (false) console.log('This won’t run.');
if (0) console.log('This won’t run.');
if ("") console.log('This won’t run.');
if (null) console.log('This won’t run.');
if (undefined) console.log('This won’t run.');
if (NaN) console.log('This won’t run.');

// Truthy values
if (1) console.log('This will run.');
if (-1) console.log('This will run.');
if ("hello") console.log('This will run.');
if ([]) console.log('This will run.');
if ({}) console.log('This will run.');

Q9.How do you convert a variable from one data type to another in JavaScript? Can you provide examples for converting between string, number, and boolean types?

###Answer: Functions in JavaScript are blocks of reusable code that help make our code more modular and maintainable. There are different ways to define functions:

Function Declaration:
```
function sumOfTwoNumbers(a, b) {
    return a + b;
}

// Function is invoked here
sumOfTwoNumbers(5, 8); // Output: 13
```
- Explanation: This is the most common way to define a function. It’s hoisted, meaning it can be called before its declaration in the code.
Function Expression:
```
let test = function () {
    console.log('I am a function');
};

test(); // Output: I am a function
```
- Explanation: In this form, a function is assigned to a variable. It’s not hoisted, so it can only be called after the assignment.
Arrow Function (introduced in ES6):
```
let testArrowFun = () => {
    console.log('I am a function');
};

testArrowFun(); // Output: I am a function
```
- Explanation: This is a shorter syntax for function expressions. It’s great for simple functions and has some differences with regular functions, such as not having its own this.

Q10. What is the difference between function declarations and function expressions in JavaScript? Can you explain how hoisting affects both?

###Answer:

Function Declarations:

Hoisting: Function declarations are fully hoisted in JavaScript. This means the entire function is moved to the top of its scope during the compilation phase. As a result, you can call a function declared this way before it's defined in the code.
```
sayHello(); // Works even though the function is declared later

function sayHello() {
    console.log('Hello!');
}
```

Function Expressions:

Hoisting: Function expressions, unlike declarations, are not hoisted. This means the function is only available after the expression is assigned. If you try to call the function before its assignment, you’ll get an error.
```
sayHello(); // Error: sayHello is not a function

let sayHello = function () {
    console.log('Hello!');
};
```

Key Difference:

Function declarations are hoisted entirely (including their code block), so you can invoke them before they are declared.
Function expressions are not hoisted because they are treated like any other variable assignment. The variable itself is hoisted, but its value (the function) is not.

Q11. What is the purpose of closures in JavaScript? Can you explain with an example?:

Closures in JavaScript:

Answer:

Closures allow a function to access variables from an outer function even after the outer function has returned. This is possible because when an inner function is created, it retains a reference to the variables from the outer (parent) function’s scope.

Here's an example of a closure:

function exampleOfClosure() {
    let outerVar = "I am outer.";

    function innerFun() {
        return outerVar; // Accessing the outerVar from the parent function
    }
    console.log(`${innerFun()} within innerFun`);
}

exampleOfClosure();

Output:

I am outer. within innerFun

Explanation:

Outer function (exampleOfClosure) defines a variable outerVar.
Inner function (innerFun) is able to access the outerVar defined in the parent function due to closure.
Even though the outer function finishes execution, the inner function still "remembers" the variable from its parent scope.

Closures are commonly used in scenarios like:

Data privacy: Keeping variables private by encapsulating them in a function.
Callbacks and event handlers: Retaining access to a specific scope even when a function is passed around or delayed.

What is this in JavaScript?

Answer:

In JavaScript, this refers to the context in which a function is called. It helps you access the current object that the function is associated with. The value of this can change depending on how a function is called. Here are some key points:

1. Global Context

In the global context (outside any function), this refers to the global object. In browsers, this is usually the window object.

Example:

console.log(this);  // In a browser, this logs the Window object

2. Function Context

Inside a regular function, this refers to the global object when the function is called in the global context.

Example:

function showThis() {
    console.log(this);
}
showThis();  // Logs the global object (window in a browser)

3. Object Method Context

When a function is called as a method of an object, this refers to the object that the method belongs to.

Example:

const person = {
    name: 'Alice',
    greet: function() {
        console.log('Hello, ' + this.name);  // this refers to the person object
    }
};

person.greet();  // Output: Hello, Alice

4. Constructor Function Context

When a function is used as a constructor (with the new keyword), this refers to the newly created object.

Example:

function Person(name) {
    this.name = name;  // this refers to the new object
}

const alice = new Person('Alice');
console.log(alice.name);  // Output: Alice

5. Arrow Functions

In arrow functions, this does not refer to the function itself but to the surrounding context where the arrow function is defined.

Example:

const person = {
    name: 'Alice',
    greet: function() {
        const arrowFunc = () => {
            console.log('Hello, ' + this.name);  // this refers to person
        };
        arrowFunc();
    }
};

person.greet();  // Output: Hello, Alice

6.Inside an Event Handler

When this is used inside an event handler, it refers to the HTML element that received the event.

Example:

const button = document.getElementById('myButton');

button.addEventListener('click', function() {
    console.log(this); // `this` refers to the button that was clicked
});

Explanation: In an event handler, this refers to the element that triggered the event (myButton in this case)

Q13. What is the temporal dead zone in JavaScript, and how does it relate to `let` and `const`?

###Answer: In JavaScript, the Temporal Dead Zone (TDZ) refers to the time between the creation of a variable (via let or const) and its initialization. Variables declared with let and const are hoisted, but they cannot be accessed until the code execution reaches the point where they are initialized. If you try to access such variables before they are initialized, JavaScript will throw a ReferenceError.

Variables declared with var do not have a TDZ because they are initialized with undefined during hoisting, allowing access before initialization without throwing an error.

Example:

console.log(a); // ReferenceError: Cannot access 'a' before initialization
let a = 10;

Here are some interview questions related to function parameters and arguments in JavaScript:

What is the difference between parameters and arguments in JavaScript?
- Follow-up: Can you provide an example that illustrates this difference?
What happens if you pass more arguments than the number of parameters defined in a function?
- Follow-up: How does JavaScript handle it? Can you show an example?
What is the arguments object in JavaScript, and how can it be used inside a function?
- Follow-up: Why would you use arguments instead of parameters in some cases?
Can you explain the concept of default parameters in JavaScript?
- Follow-up: Provide an example where default parameters might be useful.
What is the significance of the rest parameter in JavaScript?
- Follow-up: How does it differ from the arguments object? Can you show a scenario where you'd use the rest parameter?
How do you pass a function as an argument to another function (callback function)?
- Follow-up: Can you demonstrate a simple example of a callback function?
What happens if you don't pass enough arguments to a function that expects parameters?
- Follow-up: How does JavaScript handle missing arguments?
Can functions in JavaScript return multiple values? If so, how would you achieve that?
- Follow-up: Can you give an example using arrays or objects?
What are anonymous functions in JavaScript, and how do you pass them as arguments to other functions?
- Follow-up: Why might you use an anonymous function instead of a named one?
Explain the difference between call(), apply(), and bind() in terms of passing arguments to a function.

Follow-up: Can you provide examples demonstrating their differences?

Let’s break down the answers to the interview questions about function parameters and arguments in simple English, along with code examples.

1. Difference between Parameters and Arguments

Parameters are placeholders defined when creating a function. Arguments are actual values passed to the function when it is called.

Example:

function greet(name) {  // 'name' is the parameter
  console.log("Hello, " + name);
}

greet("Alice");  // "Alice" is the argument

2. Passing More Arguments than Parameters

If you pass more arguments than parameters, JavaScript will ignore the extra arguments.

Example:

function sum(a, b) {
  return a + b;
}

console.log(sum(5, 10, 20));  // Outputs: 15, ignores the third argument

3. The `arguments` Object

The arguments object is an array-like object that holds all the arguments passed to a function, regardless of the number of parameters.

Example:

function showArgs() {
  console.log(arguments);
}

showArgs(1, 2, 3);  // Outputs: [1, 2, 3]

4. Default Parameters

In JavaScript, you can set default values for parameters. If the argument is missing, the default value is used.

Example:

function greet(name = "Guest") {
  console.log("Hello, " + name);
}

greet();  // Outputs: "Hello, Guest"
greet("Alice");  // Outputs: "Hello, Alice"

5. The Rest Parameter

The rest parameter allows you to collect multiple arguments into a single array. It must be the last parameter.

Example:

function sum(...numbers) {
  return numbers.reduce((acc, curr) => acc + curr, 0);
}

console.log(sum(1, 2, 3, 4));  // Outputs: 10

Difference from arguments: rest is a real array, whereas arguments is an array-like object.

6. Passing a Function as an Argument (Callback Function)

A callback function is a function passed as an argument to another function.

Example:

function greet(name) {
  console.log("Hello, " + name);
}

function processUser(callback) {
  let user = "Alice";
  callback(user);
}

processUser(greet);  // Outputs: "Hello, Alice"

7. Missing Arguments

If a function is called with fewer arguments than defined parameters, the missing arguments are undefined.

Example:

function sum(a, b) {
  return a + b;
}

console.log(sum(5));  // Outputs: NaN (5 + undefined = NaN)

8. Returning Multiple Values

You can return multiple values using arrays or objects.

Example using an array:

function getCoordinates() {
  return [10, 20];  // Returns an array
}

const [x, y] = getCoordinates();
console.log(x, y);  // Outputs: 10 20

Example using an object:

function getUserInfo() {
  return {name: "Alice", age: 25};  // Returns an object
}

const {name, age} = getUserInfo();
console.log(name, age);  // Outputs: Alice 25

9. Anonymous Functions

Anonymous functions don’t have a name. They are often used as arguments to other functions.

Example:

setTimeout(function() {
  console.log("This is an anonymous function");
}, 1000);

10. Difference between `call()`, `apply()`, and `bind()`

call(): Invokes a function with a specific this value and individual arguments.
apply(): Invokes a function with a specific this value but passes arguments as an array.
bind(): Returns a new function with a specific this value and allows us to pass arguments over time.

Example:

function greet(greeting, name) {
  console.log(greeting + ", " + name);
}

greet.call(null, "Hello", "Alice");  // Outputs: "Hello, Alice"
greet.apply(null, ["Hi", "Bob"]);  // Outputs: "Hi, Bob"

const sayHelloToJohn = greet.bind(null, "Hello", "John");
sayHelloToJohn();  // Outputs: "Hello, John"

11. What is the length property of a string in JavaScript, and how do you use it?

Answer:

In JavaScript, the length property of a string represents the number of characters in that string. It's a read-only property, so you can't change its value directly. The length property is useful when you need to determine the size of a string, such as when iterating through each character or validating input length.

Usage Example

const greeting = "Hello, world!";
console.log(greeting.length); // Output: 13

In this example, greeting.length returns 13 because there are 13 characters in "Hello, world!", including spaces and punctuation.

12. What is the purpose of String Template Literal in JavaScript?

Answer:

The purpose of Template Literals in JavaScript is to simplify string creation, especially when working with variables or expressions. Introduced in ES6, template literals allow you to embed expressions within strings using ${expression} and support multi-line strings without extra syntax.

Key Benefits of Template Literals

Embedding Variables and Expressions: Easily include variables or expressions without breaking the string.
Multi-line Strings: Create strings that span multiple lines without needing special characters.
Enhanced Readability: Improves readability and reduces the need for concatenation (+).

Syntax and Usage Example

Template literals are defined using backticks (`):

const name = "Prashant";
const age = 25;

// Embedding variables in a string
const introduction = `Hello, my name is ${name} and I am ${age} years old.`;
console.log(introduction); 
// Output: Hello, my name is Prashant and I am 25 years old.

// Multi-line string
const multiLine = `This is a
multi-line string without
special characters.`;
console.log(multiLine);

In this example, ${name} and ${age} interpolate the values of the name and age variables directly into the string, and multi-line strings are created easily. Template literals help write cleaner, more readable, and maintainable code when handling strings in JavaScript.

13. Which method is used to check if a string includes a specific substring in JavaScript?

Answer:

In JavaScript, the includes() method is used to check if a string contains a specific substring. It returns true if the substring is found within the string and false otherwise.

Syntax

string.includes(substring, startIndex);

substring: The string you want to search for.
startIndex (optional): The position in the string to start the search. The default is 0.

Example

const sentence = "JavaScript is fun!";
console.log(sentence.includes("fun"));       // Output: true
console.log(sentence.includes("Java"));      // Output: true
console.log(sentence.includes("Python"));    // Output: false
console.log(sentence.includes("Java", 1));   // Output: false

In this example:

"fun" and "Java" are found in the string, so includes() returns true.
"Python" isn’t found, so it returns false.
Starting the search from index 1 for "Java" returns false because it’s skipped.

The includes() method is case-sensitive, meaning "fun" and "Fun" would return different results.

14. What is string padStart() ?

Answer:

In JavaScript, the padStart() method is used to pad (or add) characters to the beginning of a string until it reaches a specified length. It’s useful when you want to format strings to a fixed length by adding extra characters (usually spaces or zeros) at the start.

Syntax

string.padStart(targetLength, padString);

targetLength: The length you want the final string to reach. If the string is already longer than this length, padStart() does nothing.
padString (optional): The string to pad with. By default, it’s a space (" ").

Example

const str = "5";

// Padding to length 3 with "0"
console.log(str.padStart(3, "0")); // Output: "005"

// Padding to length 6 with "*"
console.log(str.padStart(6, "*")); // Output: "*****5"

// Padding to length 4 with default (spaces)
console.log(str.padStart(4)); // Output: "   5"

Use Case Example

The padStart() method is often used to format numbers or IDs:

const orderNumber = "42";
const paddedOrder = orderNumber.padStart(6, "0");
console.log(paddedOrder); // Output: "000042"

In this example, padStart(6, "0") pads the number with zeros so it appears as a six-digit order number.

15. What does the 'charCodeAt()' method return in JavaScript?

Answer:

In JavaScript, the charCodeAt() method returns the Unicode value (also called the UTF-16 code unit) of the character at a specified position in a string. This Unicode value is an integer between 0 and 65535, representing characters such as letters, numbers, and symbols.

Syntax

string.charCodeAt(index);

index: The position of the character in the string (starting from 0 for the first character).

If index is out of range (greater than or equal to the string length), charCodeAt() returns NaN.

Example

const text = "Hello";

console.log(text.charCodeAt(0)); // Output: 72 (Unicode for "H")
console.log(text.charCodeAt(1)); // Output: 101 (Unicode for "e")
console.log(text.charCodeAt(4)); // Output: 111 (Unicode for "o")
console.log(text.charCodeAt(10)); // Output: NaN (index out of range)

Use Case Example

The charCodeAt() method can be useful for tasks like encryption, decryption, or any operation that requires the numeric value of a character in a string.

16. What is the purpose of the 'trim()' method in JavaScript?

Answer:

In JavaScript, the trim() method is used to remove whitespace from both the beginning and end of a string. It doesn't modify the original string but returns a new string with the whitespace removed. This is useful for cleaning up user input or handling data where leading or trailing spaces may cause issues.

Syntax

string.trim();

Example

const text = "   Hello, World!   ";
console.log(text.trim()); // Output: "Hello, World!"

In this example, trim() removes the spaces at the start and end of " Hello, World! ", resulting in "Hello, World!".

Use Cases

Cleaning User Input: Useful when working with form data to ensure no unintended whitespace is included.
Data Processing: Helps in cleaning up strings for more accurate comparison and processing.

16. What string method would you use to find the index of a specific character in a string?

Answer:

In JavaScript, the indexOf() method is used to find the index of the first occurrence of a specified character or substring in a string. It returns the position of the character or substring within the string or -1 if it is not found.

Syntax

string.indexOf(searchValue, fromIndex);

searchValue: The character or substring you want to find.
fromIndex (optional): The position to start the search from. The default is 0.

Example

const text = "Hello, world!";

// Find the index of "o"
console.log(text.indexOf("o")); // Output: 4 (first "o" in "Hello")
console.log(text.indexOf("world")); // Output: 7
console.log(text.indexOf("z")); // Output: -1 (not found)

Use Cases

Checking for Substring Presence: Useful for determining if a character or substring exists within a string.
Starting Position for Further Operations: Helps locate specific positions to start or split operations within a string.

17. Which method is used to split a string into an array of substrings based on a specified separator?

Answer:

In JavaScript, the split() method is used to divide a string into an array of substrings based on a specified separator. This method is useful when you want to break down a string into smaller parts, such as words, characters, or other defined sections.

Syntax

string.split(separator, limit);

separator: The character, substring, or regular expression to use for splitting. If omitted or an empty string (""), the entire string is split into individual characters.
limit (optional): An integer specifying the maximum number of splits. Extra splits are discarded.

Example

const text = "apple,banana,cherry";

// Split by comma
const fruits = text.split(",");
console.log(fruits); // Output: ["apple", "banana", "cherry"]

// Split by each character
const characters = text.split("");
console.log(characters); 
// Output: ["a", "p", "p", "l", "e", ",", "b", "a", "n", "a", "n", "a", ",", "c", "h", "e", "r", "r", "y"]

// Split with a limit
const limitedSplit = text.split(",", 2);
console.log(limitedSplit); // Output: ["apple", "banana"]

Use Cases

Parsing CSV data: Splitting comma-separated values in strings.
Breaking sentences into words: Useful for text processing, searching, or tokenization.
Splitting by character for specific manipulations: When needing fine-grained character-level operations.

18. What does the replace method do in JavaScript?

Answer:

In JavaScript, the replace() method is used to search a string for a specified substring or pattern (using a regular expression) and replace it with a new substring. This method returns a new string with the replacements made, without modifying the original string.

Syntax

string.replace(searchValue, newValue);

searchValue: The substring or a regular expression to search for in the string.
newValue: The string to replace the matched substring or pattern.

Example 1: Basic Usage

const text = "Hello, world!";
const newText = text.replace("world", "JavaScript");
console.log(newText); // Output: "Hello, JavaScript!"

Example 2: Using Regular Expressions

You can also use regular expressions with the replace() method. By default, only the first match is replaced.

const message = "I love apples and apples are great!";
const newMessage = message.replace(/apples/g, "oranges");
console.log(newMessage); // Output: "I love oranges and oranges are great!"

In this example, the regular expression /apples/g matches all occurrences of the word "apples" and replaces them with "oranges".

Key Points

Immutability: The original string is not changed. A new string is returned.
First Match: If a string is provided as the search value, only the first occurrence will be replaced unless you use a regular expression with the global (g) flag.
Case Sensitivity: The replace() method is case-sensitive. For example, text.replace("World", "JavaScript") would not match "world".

Summary

The replace() method is useful for tasks like string manipulation, formatting, or sanitizing user input, allowing you to easily modify strings according to your needs.

19 What does the replaceAll method do in JavaScript?.

Answer:

In JavaScript, the replaceAll() method is used to search a string for all occurrences of a specified substring or pattern and replace them with a new substring. This method is similar to replace(), but it replaces all instances of the matched substring or pattern rather than just the first one.

Syntax

string.replaceAll(searchValue, newValue);

searchValue: The substring or a regular expression to search for in the string.
newValue: The string to replace the matched substring or pattern.

Example 1: Basic Usage

const text = "I love apples and apples are great!";
const newText = text.replaceAll("apples", "oranges");
console.log(newText); // Output: "I love oranges and oranges are great!"

Example 2: Using Regular Expressions

You can also use a regular expression with replaceAll(). It will replace all occurrences that match the pattern.

const message = "I like cats. Cats are great pets!";
const newMessage = message.replaceAll(/cats/gi, "dogs");
console.log(newMessage); // Output: "I like dogs. dogs are great pets!"

In this example, the regular expression /cats/gi matches all occurrences of "cats" in a case-insensitive manner (g for global and i for case-insensitive) and replaces them with "dogs".

Key Points

Replaces All Matches: Unlike replace(), which only replaces the first match, replaceAll() replaces every occurrence of the specified substring or pattern.
Immutability: Like replace(), it does not modify the original string but returns a new string with the replacements made.
Regular Expressions: You can use both strings and regular expressions as the search value, but using regular expressions is less common with replaceAll() since it’s designed to replace all occurrences directly.

Compatibility

The replaceAll() method is available in modern JavaScript (ECMAScript 2021 and later). If you need to support older environments, you may want to use replace() with a global regular expression.

Summary

The replaceAll() method is useful for string manipulation when you need to ensure that all instances of a substring or pattern are replaced, making it a convenient tool for tasks like text formatting or sanitizing input.

Q19. What is difference between find vs findIndex?

`find()`

Purpose: The find() method returns the first element in the array that satisfies the condition specified in the provided function.
If no element satisfies the condition, it returns undefined.
It checks each element until it finds a match, then returns that element directly.

Example:

const checkArr = [1, 2, 3, 4, 5];

// Find the first element greater than 2
const findFirstElement = checkArr.find(element => element > 2);
console.log(findFirstElement); // Output: 3

Here, find() returns the first element that is greater than 2, which is 3.

`findIndex()`

Purpose: The findIndex() method returns the index of the first element in the array that satisfies the condition. If no element satisfies the condition, it returns -1.
It works similarly to find(), but instead of returning the element, it returns the index of that element in the array.

Example:

const checkArr = [1, 2, 3, 4, 5];

// Find the index of the first element greater than 2
const findFirstIndex = checkArr.findIndex(element => element > 2);
console.log(findFirstIndex); // Output: 2

Here, findIndex() returns the index 2 because the first element greater than 2 is 3, which is at index 2.

Summary of Differences:

find() returns the element itself that matches the condition.
findIndex() returns the index of the element that matches the condition.
If no match is found, find() returns undefined, while findIndex() returns -1.

So, in your example:

findFirstElement would be the first element greater than 2, i.e., 3.
findFirstIndex would be the index of the first element greater than 2, i.e., 2.

Q20. What is the difference between for-in and for-of in JavaScript?

Answer:

In JavaScript, for...in and for...of are both used for iterating, but they have different purposes and work with different types of data.

`for...in`

Purpose: Iterates over the keys (or property names) of an object.
Use Case: Works best with objects, where you want to access each property name.

Syntax:

for (const key in obj) {
    // code to execute
}

Example:

const obj1 = { name: "pp", age: 25 };

for (const key in obj1) {
    console.log(key); // Output: "name", "age"
    console.log(obj1[key]); // Output: "pp", 25
}

Here, for...in iterates over the property names (name and age), allowing you to access both the keys and their values using obj1[key].

`for...of`

Purpose: Iterates over values of an iterable object (like arrays, strings, Maps, Sets, etc.).
Use Case: Works with arrays, strings, and other iterables, where you want to access each value directly.

Syntax:

for (const value of iterable) {
    // code to execute
}

Example:

const arr = ["apple", "banana", "cherry"];

for (const value of arr) {
    console.log(value); // Output: "apple", "banana", "cherry"
}

In this example, for...of iterates directly over the values of the array. Note that for...of cannot be used directly on objects because objects are not inherently iterable.

Important Note:

Attempting to use for...of on a non-iterable object (like obj1 in your example) will result in an error:

const obj1 = { name: "pp", age: 25 };

// This will throw an error because obj1 is not iterable
for (const value of obj1) {
    console.log(value);
}

Summary

for...in: Iterates over the keys of an object.
for...of: Iterates over the values of an iterable (like arrays, strings).

Q21. What is the difference between 'Pass by Value' and 'Pass by Reference'?

Answer:

In JavaScript, Pass by Value and Pass by Reference refer to how data is handled when passed to functions. Here’s the difference:

Pass by Value

Used for: Primitive data types, like Number, String, Boolean, undefined, null, Symbol, and BigInt.
How it works: When a primitive value is passed to a function, JavaScript creates a copy of the value. The function works with this copy, so any modifications within the function do not affect the original variable outside the function.

Example:

let x = 10;

function modifyValue(val) {
    val = 20;
}

modifyValue(x);
console.log(x); // Output: 10

Here, x remains 10 outside the function because val is a copy, and changing it inside the function doesn’t affect the original x.

Pass by Reference

Used for: Non-primitive data types, like Object, Array, and functions themselves.
How it works: When a non-primitive value is passed to a function, JavaScript passes a reference to the memory address where the original data is stored. Any modifications made within the function to this reference affect the original object or array outside the function.

Example:

let person = { name: "Alice" };

function changeName(obj) {
    obj.name = "Bob";
}

changeName(person);
console.log(person.name); // Output: "Bob"

In this case, person is modified because obj refers to the same memory address, so changes affect the original object.

Summary

Pass by Value: Creates a copy; changes inside the function don’t affect the original.
Pass by Reference: Passes a memory reference; changes inside the function affect the original.

Name		Name	Last commit message	Last commit date
Latest commit History 35 Commits
README.md		README.md

prashantkumarpro/JavaScript-intervew-questions

Folders and files

Latest commit

History

Repository files navigation

JavaScript-intervew-questions

** Q1: Can you explain the difference between var, let, and const in JavaScript?**

Answer:

** Q2: Can you explain hoisting in JavaScript, specifically in the context of var, let, and const?**

What is Hoisting?

Hoisting with var

Example:

Hoisting with let

Example:

Hoisting with const

Example:

Comparison of var, let, and const Hoisting

Summary:

Example Code (to understand all together):

Q3: What are the differences between var, let, and const in terms of scope, hoisting, and reassignment?

Answer:

Example to Demonstrate the Differences:

Q4: What are the different data types in JavaScript?

1. Primitive Data Types:

Example with Primitive Types (Immutable):

2. Non-Primitive Data Types (Reference Types):

Key Point:

Example with Non-Primitive Types (Mutable):

1. Pass by Value:

2. Pass by Reference:

Key Differences:

**Q5. What is the difference between == (Equality Check) and === (Strict Equality Check) in JavaScript?

Q6. What is type coercion in JavaScript?

Why is it important?

Q7. What are JavaScript data types? Can you explain the difference between null and undefined?

Q8.How do you convert a variable from one data type to another in JavaScript? Can you provide examples for converting between string, number, and boolean types?

Converting Data Types in JavaScript

Note:

Falsy Values

Truthy Values

Examples

Q9.How do you convert a variable from one data type to another in JavaScript? Can you provide examples for converting between string, number, and boolean types?

Q10. What is the difference between function declarations and function expressions in JavaScript? Can you explain how hoisting affects both?

Key Difference:

Q11. What is the purpose of closures in JavaScript? Can you explain with an example?:

Closures in JavaScript:

Answer:

Output:

Explanation:

What is this in JavaScript?

Answer:

1. Global Context

2. Function Context

3. Object Method Context

4. Constructor Function Context

5. Arrow Functions

6.Inside an Event Handler

Q13. What is the temporal dead zone in JavaScript, and how does it relate to let and const?

Here are some interview questions related to function parameters and arguments in JavaScript:

1. Difference between Parameters and Arguments

2. Passing More Arguments than Parameters

3. The arguments Object

4. Default Parameters

5. The Rest Parameter

6. Passing a Function as an Argument (Callback Function)

7. Missing Arguments

8. Returning Multiple Values

9. Anonymous Functions

10. Difference between call(), apply(), and bind()

11. What is the length property of a string in JavaScript, and how do you use it?

Answer:

Usage Example

12. What is the purpose of String Template Literal in JavaScript?

Answer:

Key Benefits of Template Literals

Syntax and Usage Example

13. Which method is used to check if a string includes a specific substring in JavaScript?

Answer:

Syntax

Example

Q1: Can you explain the difference between `var`, `let`, and `const` in JavaScript?

Q2: Can you explain hoisting in JavaScript, specifically in the context of var, let, and const?

Hoisting with `var`

Hoisting with `let`

Hoisting with `const`

Comparison of `var`, `let`, and `const` Hoisting

Q13. What is the temporal dead zone in JavaScript, and how does it relate to `let` and `const`?

3. The `arguments` Object

10. Difference between `call()`, `apply()`, and `bind()`

`find()`

`findIndex()`

Q20. What is the difference between for-in and for-of in JavaScript?

`for...in`

`for...of`