JS Interview Series - 3

I recently participated in a JS interview and was asked a couple of questions. I think it is good to share here for both myself and anyone who is lucky enough to see this blog :) Of course, I was not able to answer all of them correctly but at least try to show your thought process as can as possible. I am sharing the questions with their explanations below. Feel free to add your favorite interview questions in the comment section.

//Question: What is the output of this code ?

setTimeout(() => {
  console.log(1);
});

new Promise((resolve, reject) => {
  console.log(2);
  resolve();
  console.log(3);
}).then(() => {
  console.log(4);
});

console.log(5);
//Answer: 2 - 3 - 5 - 4 - 1

**ANSWER**:
- SetTimeout will add the code to the WEBAPI and since no timeout is provided
WEBAPI will move this code to the Event Queue immediately. In Event Queue event loop will always check if callstack is empty. If Callstack is empty and there are no pending jobs in Microtask Queue(promises, async operations) then event loop will push this code to the callstack.

- `new Promise(...)` code means this: Promise executor function starts to work immediately. We will see the output of the executor function. First 2 - 3 will be written to the console. Then Promise will be resolved. The next `then` section code will be moved to the Microtask Queue. Microtask queue has a higher precedence than event queue. (Promise > SetTimeout). After all of this there is only once code line to be executed syncronously. (Console.log(5)). And then promise resolve will be executed before settimeout.

//What is the output of below code?

function myFunc() {
  console.log("inside myFunc",this)  
  const a = {
    b: 22,
    method: () => {
      console.log(this);
    },
    method2: function() {
        console.log(this)
    }
  };
  a.method(); 
  a.method2(); 
}
myFunc.call({});

ANSWER:
   `a.method()`:  the result would be {}. Arrow functions do not have this binding. They inherit `this` from their lexical environment. Since Object a's lexical environment is myFunc function and `this` object there is {}. Because {} is explicitly set for `this` object via myFunc.call({}). If this was not set explicitly than this object would be `Window` in browsers and `global` object in node.js environments.  

  `a.method2()`: if you call a "regular method/function" like this, always left side before dot(.) will be your this object. The result would be object `a` itself.

//Reversed a linked list in javascript
//input [1,] -> [2,] -> [3,] -> [4,] -> [5,null]
//output [5,] -> [4,] -> [3,] -> [2,] -> [1,null]

// A linked list item sample
// {
//     value:1,
//     next: {...}
// }

const reverse = (list) => {
    let previous = null
    while (list) {
        const next = list.next;
        list.next = previous;
        previous = list;
        list = next
    }
    return previous
}

//sample object
const list = {
    value: 1,
    next: {
        value:2,
        next: {
            value:3,
            next: {
                value: 4,
                next: {
                    value: 5,
                    next: null
                }
            }
        }
    }
}
const reversedList = reverse(list)
console.log(list)
console.log("-------")
console.log(JSON.stringify(reversedList))

That is from me for Today. I will continue to add new questions when I have new ones. Until then, take care bye bye.