Answer: B
We have a setTimeout function and invoked it first. Yet, it was logged last.
This is because in browsers, we don't just have the runtime engine, we also have something called a WebAPI. The WebAPI gives us the setTimeout function to start with, and for example the DOM.
After the callback is pushed to the WebAPI, the setTimeout function itself (but not the callback!) is popped off the stack.

Now, foo gets invoked, and "First" is being logged.

foo is popped off the stack, and baz gets invoked. "Third" gets logged.

The WebAPI can't just add stuff to the stack whenever it's ready. Instead, it pushes the callback function to something called the queue.

This is where an event loop starts to work. An event loop looks at the stack and task queue. If the stack is empty, it takes the first thing on the queue and pushes it onto the stack.

bar gets invoked, "Second" gets logged, and it's popped off the stack.
We have a setTimeout function and invoked it first. Yet, it was logged last.
This is because in browsers, we don't just have the runtime engine, we also have something called a WebAPI. The WebAPI gives us the setTimeout function to start with, and for example the DOM.
After the callback is pushed to the WebAPI, the setTimeout function itself (but not the callback!) is popped off the stack.

Now, foo gets invoked, and "First" is being logged.

foo is popped off the stack, and baz gets invoked. "Third" gets logged.

The WebAPI can't just add stuff to the stack whenever it's ready. Instead, it pushes the callback function to something called the queue.

This is where an event loop starts to work. An event loop looks at the stack and task queue. If the stack is empty, it takes the first thing on the queue and pushes it onto the stack.

bar gets invoked, "Second" gets logged, and it's popped off the stack.
32. When you click the paragraph, what's the logged output?
A: p div
B: div p
C: p
D: div
<div onclick="console.log('div')"> <p onclick="console.log('p')"> Click here! </p> </div>A: p div
B: div p
C: p
D: div
DevScrolls
32. When you click the paragraph, what's the logged output? <div onclick="console.log('div')"> <p onclick="console.log('p')"> Click here! </p> </div> A: p div B: div p C: p D: div
Answer: A
If we click p, we see two logs: p and div. During event propagation, there are 3 phases: capturing, target, and bubbling. By default, event handlers are executed in the bubbling phase (unless you set useCapture to true). It goes from the deepest nested element outwards.
If we click p, we see two logs: p and div. During event propagation, there are 3 phases: capturing, target, and bubbling. By default, event handlers are executed in the bubbling phase (unless you set useCapture to true). It goes from the deepest nested element outwards.
33. What's the output?
} console.log(sayHi.call(person, 21)); console.log(sayHi.bind(person, 21));
A: undefined is 21 Lydia is 21
B: function function
C: Lydia is 21 Lydia is 21
D: Lydia is 21 function
const person = { name: 'Lydia' };
function sayHi(age) {
return ${this.name} is ${age}; } console.log(sayHi.call(person, 21)); console.log(sayHi.bind(person, 21));
A: undefined is 21 Lydia is 21
B: function function
C: Lydia is 21 Lydia is 21
D: Lydia is 21 function
DevScrolls
33. What's the output? const person = { name: 'Lydia' }; function sayHi(age) { return ${this.name} is ${age}; } console.log(sayHi.call(person, 21)); console.log(sayHi.bind(person, 21)); A: undefined is 21 Lydia is 21 B: function function C: Lydia is 21 Lydia…
Answer: D
With both, we can pass the object to which we want the this keyword to refer to. However, .call is also executed immediately!
.bind. returns a copy of the function, but with a bound context! It is not executed immediately.
With both, we can pass the object to which we want the this keyword to refer to. However, .call is also executed immediately!
.bind. returns a copy of the function, but with a bound context! It is not executed immediately.
34. What's the output?
function sayHi() {
return (() => 0)();
}
console.log(typeof sayHi());
DevScrolls
34. What's the output? function sayHi() { return (() => 0)(); } console.log(typeof sayHi());
Answer: B
The sayHi function returns the returned value of the immediately invoked function expression (IIFE). This function returned 0, which is type "number".
FYI: typeof can return the following list of values: undefined, boolean, number, bigint, string, symbol, function and object. Note that typeof null returns "object".
The sayHi function returns the returned value of the immediately invoked function expression (IIFE). This function returned 0, which is type "number".
FYI: typeof can return the following list of values: undefined, boolean, number, bigint, string, symbol, function and object. Note that typeof null returns "object".
👏1
An optimised way to solve this problem, check here
https://thedailyfrontend.com/check-palindrome-with-optimised-solution-in-js/
https://thedailyfrontend.com/check-palindrome-with-optimised-solution-in-js/
The Daily Frontend
Check Palindrome with Optimised Solution in JS - The Daily Frontend
Check palindrome of a given string with an optimised solution. Palindrome is a word or number that reads same as forwards and backwards.
Hey folks! If you have any doubts on frontend concepts of any type then ping in our group. I will create a blog post for you to make understand🤞
https://www.thedailyfrontend.com
https://www.thedailyfrontend.com
The Daily Frontend
Home page - The Daily Frontend
The frontend blog is about learning skills like HTML, CSS, JavaScript, and frameworks (Angular, React & Vue) & Creating custom UI components.
35. Which of these values are falsy?
A: 0, '', undefined
B: 0, new Number(0), '', new Boolean(false), undefined
C: 0, '', new Boolean(false), undefined
D: All of them are falsy
0;
new Number(0);
('');
(' ');
new Boolean(false); undefined;A: 0, '', undefined
B: 0, new Number(0), '', new Boolean(false), undefined
C: 0, '', new Boolean(false), undefined
D: All of them are falsy
DevScrolls
35. Which of these values are falsy? 0; new Number(0); (''); (' '); new Boolean(false); undefined; A: 0, '', undefined B: 0, new Number(0), '', new Boolean(false), undefined C: 0, '', new Boolean(false), undefined D: All of them are falsy
Answer: A
There are 8 falsy values:
undefined
null
NaN
false
'' (empty string)
0
-0
0n (BigInt(0))
Function constructors, like new Number and new Boolean are truthy.
There are 8 falsy values:
undefined
null
NaN
false
'' (empty string)
0
-0
0n (BigInt(0))
Function constructors, like new Number and new Boolean are truthy.
36. What's the output?
console.log(typeof typeof 1);
console.log(typeof typeof 1);
Anonymous Poll
42%
A: "number"
26%
B: "string"
13%
C: "object"
19%
D: "undefined"
👍1
DevScrolls
36. What's the output?
console.log(typeof typeof 1);
console.log(typeof typeof 1);
Answer: B
typeof 1 returns "number". typeof "number" returns "string"
typeof 1 returns "number". typeof "number" returns "string"
👍1
37. What's the output?
const numbers = [1, 2, 3]; numbers[10] = 11; console.log(numbers);
const numbers = [1, 2, 3]; numbers[10] = 11; console.log(numbers);
Anonymous Poll
29%
A: [1, 2, 3, null x 7, 11]
21%
B: [1, 2, 3, 11]
29%
C: [1, 2, 3, empty x 7, 11]
21%
D: SyntaxError
DevScrolls
37. What's the output?
const numbers = [1, 2, 3]; numbers[10] = 11; console.log(numbers);
const numbers = [1, 2, 3]; numbers[10] = 11; console.log(numbers);
Answer: C
When you set a value to an element in an array that exceeds the length of the array, JavaScript creates something called "empty slots". These actually have the value of undefined, but you will see something like:
[1, 2, 3, empty x 7, 11]
depending on where you run it (it's different for every browser, node, etc.)
When you set a value to an element in an array that exceeds the length of the array, JavaScript creates something called "empty slots". These actually have the value of undefined, but you will see something like:
[1, 2, 3, empty x 7, 11]
depending on where you run it (it's different for every browser, node, etc.)