JavaScript Questions and Answers

1. Async Await - Why we use it?

o async and await simplify handling asynchronous
code, making it look and behave more like
synchronous code. It helps avoid callback hell and
improves code readability.
2. undefined vs null vs undeclared
o undefined: A variable declared but not assigned a
value.
o null: A variable assigned with null explicitly to
indicate the absence of a value.
o undeclared: A variable that is not declared at all,
resulting in a ReferenceError if accessed.
3. Create a function without input parameter to
calculate the sum using arguments
function sum() {
return Array.from(arguments).reduce((acc, num) => acc
+ num, 0);
}
4. Do arrow functions have the arguments keyword by
default?
o No, arrow functions do not have their own arguments
object. Instead, they inherit arguments from their
enclosing function.
5. Rest vs Spread operator
o Rest (...): Collects multiple arguments into an array.
o Spread (...): Expands an array into individual
elements.
6. What is destructuring?
 o Destructuring allows extracting values from arrays or
objects into distinct variables.
7. const [a, b] = [1, 2];
8. const {name, age} = {name: 'John', age: 30};
9. Template literal tag
o A function that processes template literals before
outputting the final string.
function tag(strings, ...values) {
return strings.reduce((acc, str, i) => acc + str +
(values[i] || ''), '');
}
console.log(tag`Hello ${'World'}`);

10. How to pass a default value to a parameter?

function greet(name = 'Guest') {
console.log(`Hello, ${name}`);
}
11. How to create a global variable in JS?
o Declare a variable without let, const, or var (not
recommended) or attach it to window.
window.globalVar = 'I am global';
12. Hoisting
o JavaScript moves variable and function declarations
to the top of their scope before execution.
13. Object.freeze vs Object.seal
o Object.freeze(): Prevents adding, deleting, or
modifying properties.
 o Object.seal(): Allows modifying existing properties
but prevents adding or deleting properties.
14. let vs const vs var
o var: Function-scoped, hoisted, can be redeclared.
o let: Block-scoped, cannot be redeclared.
o const: Block-scoped, cannot be redeclared, and must
be initialized.
15. shift and unshift
o shift(): Removes the first element from an array.
o unshift(): Adds elements to the beginning of an array.
16. splice and slice
o splice(): Modifies the array by adding/removing
elements.
o slice(): Returns a new array containing selected
elements.
17. Event loop, microtask, macrotask
o Event loop handles asynchronous operations by
executing microtasks before macrotasks.
18. Promise
o Represents an asynchronous operation that can be
resolved or rejected.
19. Promise alternative
o async/await, setTimeout, Observables.
20. Prototype inheritance
o Objects inherit properties and methods from their
prototype.
21. this in function vs arrow function
o In normal functions, this depends on how the function
is called.
o In arrow functions, this is lexically bound.
22. Normal vs arrow function
o Normal functions have their own this, whereas arrow
functions inherit this from their surrounding scope.
23. Execution order:
24. console.log(1);
25. setTimeout(() => console.log(2), 0);
26. Promise.resolve().then(() => console.log(3));
27. setTimeout(() => console.log(4), 1);
28. console.log(5);
o Output: 1 5 3 2 4
29. Deep copy apart from JSON.stringify()
o Use structuredClone().
30. const deepCopy = structuredClone(obj);
31. Shallow Copy
o Copies references but not nested objects.
32. Ways to create a shallow copy
o Object.assign(), spread operator (...),
Array.prototype.slice().
33. What is a deep copy?
o A copy where nested objects are cloned instead of
referenced.
Angular Questions and Answers
1. ViewChild Lifecycle
o ngAfterViewInit()
2. Mat Dialog
o Used for creating modal popups in Angular Material.
3. Smart vs Dumb Components
o Smart: Handles business logic.
o Dumb: Displays UI, receives inputs via @Input().
4. ngOnChanges Use
o Executes when input properties change.
5. formValueChanges
o Observes and reacts to form control changes.
6. Standalone Components
o Components that do not require NgModules.
7. Angular Architecture
o Consists of Modules, Components, Directives,
Services, etc.
8. Angular Signals
o Tracks changes in component state efficiently.
9. Differ Loading
o Loads parts of an app dynamically.
10. Eager Loading
o Loads all modules at the start.
11. Nullish Coalescing
o ?? operator returns the right-hand side if the left is
null or undefined.
12. Ng-Container
 o Does not render any DOM element but helps in
structural directives.
13. Ng-Template
o Defines HTML templates that can be reused
dynamically.
14. Ng-Content
o Used for content projection in components.
15. Benefits of Standalone Components
o Reduces module complexity.
16. Load Standalone Components with Routing
o Use loadComponent in route configurations.
17. AuthGuard
o Protects routes based on authentication.
18. Interceptor (Middleware)
o Modifies HTTP requests/responses globally.
19. Can we write a component without a
constructor?
o Yes, but constructors are helpful for dependency
injection.
20. ViewChild vs ViewChildren
o ViewChild: Selects a single element.
o ViewChildren: Selects multiple elements.
21. What is Subject?
o A special type of Observable that allows multicasting.