Here's the detailed timetable from June 17th #### 1:00 PM - 2:00 PM (1 hour)

10:16 PM to June 19th 10:30 AM:

- **Break**
### Day 1: June 17th

#### 10:16 PM - 1:00 AM (2 hours 44 minutes)

#### 2:00 PM - 5:00 PM (3 hours)
- **Introduction to JavaScript**
- **Objects and Arrays**
- Overview of JavaScript and its uses
- Creating and manipulating objects
- Setting up the development environment
(Node.js, browsers) - Arrays and array methods

- Basic syntax and operators - Destructuring

### Day 2: June 18th #### 5:00 PM - 8:00 PM (3 hours)

- **DOM Manipulation**
#### 7:00 AM - 10:00 AM (3 hours)

- **Fundamentals** - Selecting and modifying DOM elements

- Variables, data types, and constants - Event listeners and handlers

- Creating dynamic content

- Basic input/output

- Conditional statements (if, else, switch)

#### 8:00 PM - 9:00 PM (1 hour)

- **Dinner Break**
#### 10:00 AM - 1:00 PM (3 hours)

- **Loops and Functions**

- Loops (for, while, do-while) #### 9:00 PM - 12:00 AM (3 hours)

- Functions and scope - **Advanced Topics**

- Arrow functions - Higher-order functions

- Callbacks, Promises, and Async/Await

- Error handling
### Day 3: June 19th #### 5:00 PM - 8:00 PM (3 hours)

#### 7:00 AM - 10:00 AM (3 hours) - **Practice Project**

- **Working with APIs** - Building a small project to integrate learned

concepts
- Fetch API and AJAX
- Debugging and troubleshooting
- Handling API responses

- Practical example with a public API

#### 8:00 PM - 9:00 PM (1 hour)

- **Dinner Break**
#### 10:00 AM - 1:00 PM (3 hours)

- **Modern JavaScript (ES6+)**

#### 9:00 PM - 10:30 PM (1.5 hours)
- Let, const, and block scope
- **Review and Q&A**
- Classes and inheritance
- Revisiting challenging topics
- Modules and import/export
- Q&A session (with yourself or a study group)

- Planning next steps for continued learning

#### 1:00 PM - 2:00 PM (1 hour)

- **Break**
Here are some common JavaScript interview
questions along with concise answers:
#### 2:00 PM - 5:00 PM (3 hours)

- **Tooling and Workflow** 1. **What is JavaScript?**

- Setting up a development workflow - JavaScript is a programming language
(Webpack, Babel) commonly used to create interactive effects
- Linting and formatting (ESLint, Prettier) within web browsers.

- Using version control (Git basics)

2. **What are the data types supported by
JavaScript?**

- Number, String, Boolean, Object, Undefined,

Null, Symbol, BigInt.
3. **What is the difference between `let`, 9. **What is the `this` keyword?**
`const`, and `var`?**
- `this` refers to the context in which a
- `let` and `const` have block scope, while `var` function is executed.
has function scope; `const` is used for
constants.
10. **What are promises?**

4. **What is a closure?** - Promises are objects that represent the

eventual completion (or failure) of an
- A closure is a function that retains access to asynchronous operation and its resulting value.
its lexical scope even when the function is
executed outside that scope.
11. **What is `async/await`?**

- `async/await` are syntactic sugar over

5. **What is hoisting?**
promises, making asynchronous code look and
- Hoisting is JavaScript's default behavior of behave more like synchronous code.
moving declarations to the top of the current
scope.
12. **What is a callback function?**

6. **What are Arrow functions?** - A callback function is a function passed into

another function as an argument to be
- Arrow functions provide a shorter syntax for executed later.
writing functions and do not have their own
`this` context.
13. **What is the DOM?**

7. **What is the event loop?** - The DOM (Document Object Model) is a

programming interface for HTML and XML
- The event loop is a process that handles and documents, representing the structure as a
executes asynchronous code in JavaScript. tree.

8. **What is the difference between `==` and 14. **How do you select elements in the
`===`?** DOM?**

- `==` checks for value equality with type - Using methods like `getElementById`,
coercion, while `===` checks for value and type `getElementsByClassName`,
equality. `getElementsByTagName`, `querySelector`, and
`querySelectorAll`.
15. **What are higher-order functions?**

- Higher-order functions are functions that 21. **What are modules in JavaScript?**
can take other functions as arguments or return
them as results. - Modules are reusable pieces of code that
can be imported and exported between files
using `import` and `export` statements.

16. **What is the difference between `null` and

`undefined`?**
22. **What is event delegation?**
- `null` is an assignment value representing no
- Event delegation is a technique of using a
value, while `undefined` means a variable has
been declared but not assigned a value. single event listener to manage all events of a
particular type on multiple child elements.

17. **What is the use of `JSON.stringify` and

`JSON.parse`?** 23. **What is the difference between
synchronous and asynchronous code?**
- `JSON.stringify` converts a JavaScript object
to a JSON string, and `JSON.parse` converts a - Synchronous code is executed in sequence,
blocking further execution until it finishes, while
JSON string to a JavaScript object.
asynchronous code allows other operations to
continue before completing.

18. **What are template literals?**

- Template literals are string literals allowing 24. **What is `NaN`?**

embedded expressions, written with backticks
(`) and `${expression}` syntax. - `NaN` stands for Not-a-Number and is a
value representing an undefined or
unrepresentable number.

19. **What is destructuring?**

- Destructuring is a syntax that allows you to 25. **What are `Map` and `Set` objects?**
unpack values from arrays or properties from
objects into distinct variables. - `Map` is a collection of key-value pairs, and
`Set` is a collection of unique values.

20. **What is the spread operator?**

26. **What is `strict mode`?**
- The spread operator (`...`) allows an iterable
to expand in places where multiple arguments - `Strict mode` is a way to opt into a restricted
or elements are expected. variant of JavaScript, which can help catch
common coding errors and unsafe actions.
27. **What is the difference between `call`, 32. **What are proxies in JavaScript?**
`apply`, and `bind`?**
- Proxies are objects that allow you to create
- `call` and `apply` invoke a function with a custom behavior for fundamental operations
given `this` value and arguments, `call` takes (e.g., property lookup, assignment).
arguments individually, `apply` takes them as an
array; `bind` returns a new function with a given
`this` value and arguments. 33. **What are symbols?**

- Symbols are a unique and immutable

28. **What is an Immediately Invoked Function primitive value that can be used as the key of an
Expression (IIFE)?** object property.

- An IIFE is a function that is executed

immediately after it is defined, typically used to 34. **What is `typeof` operator?**
create a new scope.
- `typeof` is an operator that returns a string
indicating the type of the unevaluated operand.
29. **What are JavaScript data structures like
`Map` and `WeakMap`?**
35. **What is `instanceof` operator?**
- `Map` is a collection of key-value pairs,
`WeakMap` is similar but keys are weakly - `instanceof` checks whether an object is an
referenced, preventing memory leaks. instance of a specific class or constructor.

Certainly! Here are 100 JavaScript interview

questions starting from question 36, with no
30. **What is the difference between `for...of` repetitions:
and `for...in`?**

- `for...of` iterates over iterable objects like

arrays, `for...in` iterates over enumerable 36. **What is a polyfill?**
properties of an object.
- A polyfill is code that provides modern
functionality on older browsers that do not
natively support it.
31. **What is a generator function?**

- A generator function is a function that can

pause its execution and resume later,
maintaining its context, using `function*` syntax
and `yield`.
37. **What is event bubbling and capturing?**

- Event bubbling is when an event propagates 43. **What is CORS?**

from the target element up to the root, event
capturing is the reverse, from the root to the - CORS (Cross-Origin Resource Sharing) is a
target. mechanism to allow or restrict requested
resources on a web server based on the origin
of the request.

38. **What is the difference between `==` and

`Object.is`?**
44. **What are service workers?**
- `Object.is` compares two values for strict
equality but treats `NaN` as equal to `NaN` and - Service workers are scripts that run in the
`+0` not equal to `-0`. background and provide features like push
notifications and background sync for web
applications.

39. **What is a debounce function?**

- A debounce function limits the rate at which 45. **What is the `Fetch API`?**
a function can fire, ensuring it is not called again
- The Fetch API provides an interface for
until a certain amount of time has passed.
fetching resources (e.g., across the network),
simpler and more powerful than
`XMLHttpRequest`.
40. **What is a throttle function?**

- A throttle function ensures a function is

called at most once in a specified period, 46. **What is `localStorage`?**
controlling the rate of function calls.
- `localStorage` is a web storage object that
allows you to store key-value pairs in a web
browser with no expiration time.
41. **What are Web Workers?**

- Web Workers are a way to run scripts in

background threads, allowing for concurrent 47. **What is `sessionStorage`?**
execution in web applications.
- `sessionStorage` is similar to `localStorage`
but data is only stored for the duration of the
page session.
42. **What is a `Blob`?**

- A `Blob` is a file-like object of immutable,

raw data, often used for file handling and binary
data.
48. **What is a cookie?** 54. **What is the difference between
`Object.create` and `new`?**
- A cookie is a small piece of data stored by
the browser that can be sent back to the server - `Object.create` creates a new object with
with subsequent requests. the specified prototype object and properties,
`new` creates an instance of a user-defined
object type or one of the built-in object types.
49. **What is the `use strict` directive?**

- `use strict` is a directive that helps catch 55. **What is `Promise.all`?**

common coding errors and "unsafe" actions in
JavaScript by enforcing stricter parsing and - `Promise.all` takes an iterable of promises
error handling. and returns a single promise that resolves when
all of the promises have resolved.

50. **What are tagged template literals?**

56. **What is the difference between deep and
- Tagged template literals allow you to parse shallow copy?**
template literals with a function.
- A shallow copy copies an object's structure
but not the nested objects, while a deep copy
51. **What is the purpose of `Object.freeze`?** duplicates everything, creating entirely new
instances.
- `Object.freeze` prevents modification to
properties and values of an object, making it
immutable. 57. **What is `this` in JavaScript?**

- `this` refers to the object from which the

52. **What is function currying?** function was called.

- Currying is the process of transforming a

function with multiple arguments into a 58. **What is `try...catch`?**
sequence of functions each taking a single
argument. - `try...catch` is a statement that allows you to
handle errors in JavaScript.

53. **What is the `eval` function?**

- `eval` is a function that executes a string of

JavaScript code.
59. **What is the `spread` syntax?** 64. **What is the `Object.assign` method?**

- The spread syntax allows an iterable such as - `Object.assign` copies enumerable own
an array or string to be expanded in places properties from one or more source objects to a
where zero or more arguments (for function target object, and returns the target object.
calls) or elements (for array literals) are
expected.
65. **What are template strings (template
literals)?**
60. **What is the `rest` parameter?**
- Template strings, or template literals, are
- The rest parameter syntax allows us to string literals that allow embedded expressions,
represent an indefinite number of arguments as using backticks (`` ` ``) and `${}` syntax.
an array.

66. **What is an iterable?**

61. **What is a promise chain?**
- An iterable is an object that can be iterated
- A promise chain is a series of `.then()` calls, over with a `for...of` loop, and has a
where each subsequent `.then()` runs after the `Symbol.iterator` method that returns an
previous promise resolves. iterator.

62. **What is an async generator function?** 67. **What is an iterator?**

- An async generator function is a function - An iterator is an object with a `next` method

that can yield promises and return a sequence that returns an object with `value` and `done`
of asynchronous values using `async function*` properties.
syntax.

68. **What is the difference between

63. **What is destructuring assignment?** `Array.map` and `Array.forEach`?**

- Destructuring assignment is a syntax that - `Array.map` returns a new array with the
allows extracting values from arrays or results of calling a provided function on every
properties from objects into distinct variables. element, while `Array.forEach` executes a
provided function once for each array element
but does not return anything.
69. **What is the difference between 74. **What is the `Reflect` API?**
`Array.filter` and `Array.find`?**
- The `Reflect` API provides methods for
- `Array.filter` returns a new array with all interceptable JavaScript operations, similar to
elements that pass the test implemented by the most of the methods on the `Proxy` handler
provided function, while `Array.find` returns the object, but also includes some methods not
value of the first element that satisfies the specific to proxies.
provided testing function.

75. **What is tail call optimization?**

70. **What is the `typeof` operator?**
- Tail call optimization is an optimization
- The `typeof` operator returns a string where the compiler can optimize recursive calls
indicating the type of the unevaluated operand. to avoid growing the call stack, making
recursive functions more efficient.

71. **What is a WeakSet?**

- A `WeakSet` is a collection of objects where

the references are weak, allowing objects to be 76. **What is the purpose of the `with`
garbage-collected if there are no other statement?**
references to them.
- The `with` statement extends the scope
chain for a statement, but its use is discouraged
as it can make code harder to understand and
72. **What is a WeakMap?** debug.
- A `WeakMap` is a collection of key-value
pairs where keys are objects and the references
are weak, allowing the keys to be garbage- 77. **What is the `debugger` statement?**
collected if there are no other references to
them. - The `debugger` statement invokes any
available debugging functionality, such as
setting a breakpoint in the code.

73. **What is the `Proxy` object?**

- The `Proxy` object is used to define custom 78. **What is a JavaScript engine?**
behavior for fundamental operations like
property lookup, assignment, enumeration, - A JavaScript engine is a program or
function invocation, etc. interpreter that executes JavaScript code, such
as V8 (Chrome, Node.js), SpiderMonkey
(Firefox), or JavaScriptCore (Safari).
79. **What is `Event.preventDefault`?** 85. **What is `Object.entries`?**

- `Event.preventDefault` is a method that - `Object.entries` returns an array of a given

cancels the event if it is cancelable, preventing object's own enumerable string-keyed property
the default action that belongs to the event. `[key, value]` pairs.

80. **What is `Event.stopPropagation`?** 86. **What is `Object.values`?**

- `Event.stopPropagation` is a method that - `Object.values` returns an array of a given

prevents further propagation of the current object's own enumerable property values.
event in the capturing and bubbling phases.

81. **What is a singleton pattern?**

87. **What is `Object.fromEntries`?**
- The singleton pattern is a design pattern
that restricts the instantiation of a class to a `Object.fromEntries` transforms a list of key-
single instance. value pairs into an object.

82. **What is the `new.target` in JavaScript?**

- `new.target` is a meta-property that allows

constructors to check whether they were called
using the `new` operator.

83. **What is object destructuring?**

- Object destructuring is a syntax that allows

you to extract properties from an object and
assign them to variables.

84. **What is array destructuring?**

- Array destructuring is a syntax that allows

you to unpack values from arrays into distinct
variables.