JavaScript Basics

Question 1

What are the primitive data types in JavaScript?

Answer 1

The primitive data types in JavaScript are:
* String
* Number
* Boolean
* Null
* Undefined
* Symbol
* BigInt

None

Question 2

Explain the difference between null and undefined.

Answer 2

Undefined means a variable has been declared but not assigned a value. Null is an explicit assignment to represent ‘no value’ or ‘empty’.

Undefined is a type itself, while null is an object (though this is considered a bug in JavaScript)

Question 3

What is the difference between let, const, and var?

Answer 3

var is function-scoped and hoisted.
let is block-scoped, can be reassigned, but not redeclared in the same scope.
const is block-scoped, cannot be reassigned or redeclared, but object properties can still be modified.

None

Question 4

What is variable hoisting?

Answer 4

Hoisting is JavaScript’s behavior of moving declarations to the top of their containing scope during compilation.

• Function Declarations: Function declarations are fully hoisted, meaning you can call a function before it is defined in the code.
• var are hoisted and initialized with undefined
• let and const are hoisted but not initialized (temporal dead zone)

Question 5

What are the different ways to create a function in JavaScript?

Answer 5

Function declaration: function name() {};
Function expression: const name = function() {};
Arrow function: const name = () => {};
Method in object: const obj = { name() {} }.

None

Question 6

What is a closure in JavaScript?

Answer 6

A closure is a function that has access to its own scope, the scope of the outer function, and global scope, even after the outer function has returned.

None

Question 7

How do arrow functions differ from regular functions?

Answer 7

• ‘This’ binding is from surrounding context
• don’t have their own arguments object
• can’t be used as constructors
• have implicit return for one-liners

None

Question 8

What is a callback function?

Answer 8

A callback function is a function passed as an argument to another function, which is then invoked inside the outer function to complete some action.

None

Question 9

Explain the concept of ‘this’ in JavaScript.

Answer 9

‘this’ refers to the object that is executing the current function. Its value depends on how the function is called.

In methods, it refers to the owner object; in regular functions, it refers to the global object (or undefined in strict mode); in events, it refers to the element that received the event.

Question 10

What are the ways to explicitly set the value of ‘this’?

Answer 10

You can explicitly set ‘this’ using:
* call()
* apply()
* bind()

None

Question 11

What is the difference between synchronous and asynchronous code?

Answer 11

Synchronous code executes sequentially line by line, blocking further execution until the current operation completes. Asynchronous code allows operations to run in the background without blocking the main thread.

It uses callbacks, promises, or async/await to handle results.

Question 12

Explain promises in JavaScript.

Answer 12

Promises are objects representing the eventual completion or failure of an asynchronous operation. They have three states:
* pending
* fulfilled (resolved)
* rejected

They use .then() for success handlers and .catch() for error handlers.

Question 13

What is the difference between promises and async/await?

Answer 13

Async/await is syntactic sugar over promises, making asynchronous code look and behave more like synchronous code.

async functions always return promises, and await can only be used inside async functions to pause execution until a promise resolves.

Question 14

Explain the event loop in JavaScript.

Answer 14

The event loop continuously checks if the call stack is empty. If empty, it takes the first task from the queue and pushes it onto the stack for execution.

This enables JavaScript’s non-blocking, asynchronous behavior despite being single-threaded.

Question 15

What is the difference between map, filter, and reduce?

Answer 15

map() creates a new array by transforming each element.
filter() creates a new array with elements that pass a test function.
reduce() accumulates array elements into a single value based on a function with an accumulator.

None

Question 16

How do you clone an object in JavaScript?

Answer 16

• Object.assign({}, obj)
• spread operator ({…obj}).
• JSON.parse(JSON.stringify(obj)),
• using libraries like Lodash’s cloneDeep, or the structured clone API.

Deep cloning has limitations.

Question 17

What is destructuring in JavaScript?

Answer 17

Destructuring is a syntax that allows you to extract multiple properties from arrays or objects into distinct variables:
* const {name, age} = person; for objects
* const [first, second] = array; for arrays.

None

Question 18

How do you check if a property exists in an object?

Answer 18

1. Using the “in” operator (console.log(‘name’ in obj)
2. Using the hasOwnProperty() method. (console.log(obj.hasOwnProperty(‘name’));)
3. Check for “undefined”
4. Use obj.keys() to return array of property names.

None

Question 19

What are template literals?

Answer 19

Template literals are string literals allowing embedded expressions and multi-line strings, denoted with backticks (``). They allow string interpolation with ${expression} syntax.

None

Question 20

What String methods would you use to transform ‘hello world’ to ‘Hello World’?

Answer 20

You can split the string, capitalize the first letter of each word, and join it back:
* ‘hello world’.split(‘ ‘).map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(‘ ‘).

None

Question 21

How would you check if a string contains a specific substring?

Answer 21

Using includes(): string.includes(substring)

None

Question 22

What are the benefits of using ES6 modules?

Answer 22

ES6 modules provide:
* Better organization
* Explicit imports/exports
* Better dependency management
* Tree Shaking. Eliminate unused code, smaller bundle
* Reusability
* Encapsulation
* Modularity

None

Question 23

What is the spread operator and how is it used?

Answer 23

• It allows an iterable (like an array or an object) to be expanded into individual elements or properties.
• It is commonly used for array manipulation, function arguments, and object cloning or merging.
• Array concatenation
• Copying arrays/objects
• Spreading arguments in function calls
• Gathering rest parameters

None

Question 24

What is the optional chaining operator (?.) and when would you use it?

Answer 24

Allows you to safely access deeply nested properties of an object without having to explicitly check if each reference in the chain is null or undefined.

• const city = user.profile?.address?.city; // ‘Wonderland’
• const zipCode = user.profile?.address?.zipCode; // undefined

It returns undefined if any reference is null or undefined instead of throwing an error.

Question 25

How do you handle errors in JavaScript?

Answer 25

Using try/catch blocks for synchronous code, .catch() for promises, and try/catch with async/await for asynchronous code. ## Footnote You can also use the global error event or window.onerror handler.

Question 26

What is the difference between throw and return when handling errors?

Answer 26

throw generates an exception that will terminate execution unless caught in a try/catch. return simply passes a value back from a function without interrupting execution flow. ## Footnote throw is used for exceptional conditions, while return is for normal program flow.

Question 27

What is garbage collection in JavaScript?

Answer 27

Garbage collection is the process of automatically freeing memory that is no longer referenced by the program. ## Footnote JavaScript uses algorithms like mark-and-sweep to identify and remove unreachable objects.

Question 28

How does JavaScript handle memory management?

Answer 28

JavaScript automatically allocates memory when objects are created and frees it when they're no longer referenced (garbage collection). ## Footnote Memory leaks can occur with circular references, forgotten timers/callbacks, or closures referencing large objects.

Question 29

What are the most reliable resources for JavaScript documentation?

Answer 29

Reliable resources include: * MDN Web Docs (Mozilla Developer Network) * JavaScript.info * The official ECMAScript specification * W3Schools * Stack Overflow for community solutions ## Footnote None

Question 30

If you encounter an unfamiliar JavaScript method, how would you research it?

Answer 30

Check MDN Web Docs for official documentation, search for examples on Stack Overflow, look for tutorials on developer blogs, or check the official documentation of the library/framework if it's not a native JavaScript method. ## Footnote None