1. Tell me about a difficult problem you solved in your work and a highlight of your project

The interviewer is looking for your problem-solving skills

2. Do you know that browsers have event loops?

2.1 Why does JS have an event loop mechanism in browsers?

  • Js is single threaded
  • Event loop is used for non-blocking events

2.2 Did you understand that there are two types of tasks in the event loop?

  • Macro tasks: overall code, setTimeout, setInterval, I/O operations

  • Microtasks: New Promise(). Then, MutaionObserver

2.3 Why is the concept of microtask introduced? Is only macro task ok?

  • Macro tasks: first in, first out (FIFO).
  • Microtasks: Some high-priority events need to be executed first. Microtasks are executed before completion. Macrotasks are executed after completion of microtasks

2.4 What is the difference between the event loop in Node and the event loop in browser?

Order of execution of macro tasks:

  1. Timers: Executes the scheduled setTimeout and setInterval callback functions
  2. Pending Callback: AN I/O callback that is deferred until the next iteration of the loop
  3. Idle, prepare: used only in the system
  4. Poll: Retrieves new I/O events and performs I/ O-related callbacks
  5. Check: Executes the setImmediate() callback function
  6. close callbacks: socket.on(‘close’, () => {})

Microtasks and macro tasks are executed in node in the following order:

Node V10 and before:

  1. Complete all tasks in a phase
  2. Execute the contents of the nextTick queue
  3. Finish executing the contents of the microtask queue

After Node V10: Browsers behave like Nodes

3. I know a lot about it. Let’s try some questions

  1. The first question
async function async1 () {
  console.log('async1 start')
  await async2();
  console.log('async1 end')}async function async2() {
  console.log('async2')}console.log('script start')

setTimeout(function() {
  console.log('setTimeout')},0)

async1()

new Promise(function(resolve) {
  console.log('promise1')
  resolve()
}).then(function () {
  console.log('promise2')})console.log('script end')
Copy the code
  1. The second problem is
console.log("start");

setTimeout(() = > {
  console.log("children 2")
  Promise.resolve().then(() = > {
    console.log("children 3")})},0)

new Promise(function (resolve, reject) {
  console.log("children 4")
  setTimeout(function () {
    console.log("children 5")
    resolve("children 6")},0)
}).then((res) = > {
  console.log("children 7")
  setTimeout(() = > {
    console.log(res)
  }, 0)})// start
// children 4
// children 2
// children 5
// children 3
// children 7
// children 6
Copy the code

3

const p = function () {
  return new Promise((resolve, reject) = > {

    const p1 = new Promise((resolve, reject) = > {
      setTimeout(() = > {
        resolve(1)},0)
      //resolve(2)
    })
    p1.then((res) = > {
      console.log(res)
    })
    console.log(3)
    resolve(4)
  })
}

p().then((res) = > {
  console.log(res)
})

console.log('end')

/ / 3
/ / 2
/ / 4
// end

Copy the code