JavaScript

Question 1

Explain the difference between synchronous and asynchronous functions.

Answer 1

Synchronous functions are sequential and blocking. Asynchronous functions are non-blocking, e.g. promises.

Question 2

Why is fetch the preferred way to send a network request via the web browser?

Answer 2

Because
1. It is natively supported in all modern browsers
2. It has a clean, simple syntax
3. It supports canceling with AbortSignal

Question 3

What is one disadvantage of using fetch?

Answer 3

It does not reject on HTTP error status (e.g., 404, 500); you have to handle those manually

Question 4

If the browser encounters malformed HTML, what happens?

Answer 4

1. HTML Parser Steps In:
   The browser’s HTML parser tries to fix or “guess” the intended structure using built-in rules defined in the HTML specification.
2. DOM Tree Is Built Anyway:
   Even with errors, the browser still builds the DOM (Document Object Model), possibly inserting or moving elements to make the structure valid.
3. Rendering Continues:
   The browser proceeds to render the page based on its best interpretation of the HTML, though the visual or functional outcome might not be what the developer intended.

Question 5

Is there another option, besides explicit promises, to handle asynchronous code in JavaScript?

Answer 5

Yes, besides explicit Promises, JavaScript provides async/await as a modern and more readable way to handle asynchronous code.

Benefits Over Explicit Promises:
1. Cleaner syntax — avoids deeply nested .then() chains.
2. Better error handling — you can use try…catch just like in synchronous code.
3. Easier debugging — stack traces are easier to follow.

Question 6

Explain the function and syntax of the array forEach() method.

Answer 6

The forEach() method in JavaScript is used to iterate over each element in an array and execute a function for every item.

array.forEach(callback(currentValue, index, array), thisArg);

Question 7

Explain the function and syntax of the function bind() method.

Answer 7

The bind() method in JavaScript is used to create a new function with a specific this context, and optionally, preset arguments.

const boundFunction = originalFunction.bind(thisArg[, arg1, arg2, …]);

Question 8

Is there a way to stop an event from bubbling up?

Answer 8

Yes, in JavaScript you can stop an event from bubbling up through the DOM by using the method:
event.stopPropagation()

Question 9

How is the event loop defined in the JavaScript engine?

Answer 9

The event loop is the mechanism in the JavaScript engine that monitors the call stack and the task queues, and pushes asynchronous callbacks (like from setTimeout, fetch, DOM events, etc.) into the call stack when it’s empty, ensuring smooth execution of both synchronous and asynchronous code.

Question 10

How do callbacks work in JavaScript?

Answer 10

A callback in JavaScript is a function passed as an argument to another function, and it’s intended to be invoked later, usually after some operation is complete.

They work by being:
1. Passed as an argument to another function.
2. Stored in memory just like any other value.
3. Invoked (called) at a later point inside the “host” function.

Question 11

Have you worked with jQuery or other JS libraries actively?

Answer 11

Examples of other JavaScript Libraries / Frameworks
- React (with hooks, context, routing, testing)
- Vue.js (options & composition API)
- Angular (modules, services, observables)
- Lodash (utility functions for objects, arrays, etc.)
- D3.js (data visualizations)
- Moment.js / date-fns (date manipulation)
- Three.js (3D graphics in WebGL)
- RxJS (reactive programming with observables)

Question 12

What design patterns do you know?

Answer 12

Classic Design Patterns Best Suited for React + Redux Front-End:
1. Observer Pattern: Objects (observers) subscribe to changes in a subject and get notified automatically, e.g. React components subscribe to Redux store changes
2. Facade Pattern: Provides a simplified interface to a complex subsystem, e.g. Abstract complex APIs, wrap Redux logic
3. Singleton Pattern: Ensures a class has only one instance, e.g. Single Redux store instance, single service instances
4. Command Pattern: Encapsulates a request as an object, allowing parameterization and queuing, e.g. Redux actions as commands, middleware intercepts
5. Proxy Pattern: Provides a placeholder or surrogate for another object to control access, e.g. Middleware/services intercepting calls/state access