Interview Preparation for Angular, ReactJS

References.md

References

Table of contents

• Part 1: JavaScript Foundation
• Part 2: Web General

Part 1: JavaScript Foundation

1. Event loop

   • The event loop - JavaScript | MDN
   • In depth: Microtasks and the JavaScript runtime environmentIn depth: Microtasks and the JavaScript runtime environment - WebAPIs | MDN
   • Using microtasks in JavaScript with queueMicrotask() - WebAPIs | MDN
   • Event loop: microtasks and macrotasks | JavaScript.info
   • Event Loop - Vietnamese

2. Closures and Variable scopes

   • Closures - JavaScript | MDN
   • Scopes - JavaScript | MDN

3. Inheritance

   • Inheritance and the prototype chain - Closures - JavaScript | MDN

4. Hoisting

   • Hoisting - JavaScript | MDN

5. Functional Programming

   • Functional Programming With JavaScript: A Deep Dive | Hackernoon

6. Event bubbling

   • Event bubbling | MDN
   • Event Bubbling and capturing | Javascript

7. To be added

Part 2: Web General

1. Web critical rendering path

   • Understanding the critical path | web.dev

2. Web Accessibility

   • Introduction to Web Accessibility | Web Accessibility Initiative (WAI) | W3C

3. Web Optimization

   • Web performance | MDN

4. To be added

Event loop examples

// Start
// add to callstack and execute -> synchronous -> log 1
console.log(1);

// add to callstack and execute (done)
// -> asynchronous (WebAPI Timer)
// -> WebAPI count time
// -> Wait until time up
// -> And enqueue callback into Task Queue
setTimeout(() => console.log(2), 1000);

// add to callstack and execute (done)
// -> asynchronous
// -> enqueue callback into MicroTask Queue
Promise.resolve().then(() => console.log(3));
// same priority
queueMicrotask(() => console.log("3+"));

new Promise((resolve) => setTimeout(resolve, 3000)).then(() =>
  console.log("3*")
);

// add to callstack and execute (done)
// -> asynchronous (WebAPI Timer)
// -> WebAPI count time
// -> Wait until time up
// -> And enqueue callback into Task Queue
setTimeout(() => console.log(4), 500);

// add to callstack and execute
// -> synchronous
// log 5
console.log(5);