Web Totals

Question 21 - 30

#Q21. What's the value of sum?

const sum = eval('10*10+5');
javascript
  • A: 105
  • B: "105"
  • C: TypeError
  • D: "10*10+5"
💡 Answer

Answer: A

eval evaluates codes that's passed as a string. If it's an expression, like in this case, it evaluates the expression. The expression is 10 * 10 + 5. This returns the number 105.

#Q22. How long is cool_secret accessible?

sessionStorage.setItem('cool_secret', 123);
javascript
  • A: Forever, the data doesn't get lost.
  • B: When the user closes the tab.
  • C: When the user closes the entire browser, not only the tab.
  • D: When the user shuts off their computer.
💡 Answer

Answer: B

The data stored in sessionStorage is removed after closing the tab.

If you used localStorage, the data would've been there forever, unless for example localStorage.clear() is invoked.

#Q23. What's the output?

var num = 8;
var num = 10;

console.log(num);
javascript
  • A: 8
  • B: 10
  • C: SyntaxError
  • D: ReferenceError
💡 Answer

Answer: B

With the var keyword, you can declare multiple variables with the same name. The variable will then hold the latest value.

You cannot do this with let or const since they're block-scoped.

#Q24. What's the output?

const obj = { 1: 'a', 2: 'b', 3: 'c' };
const set = new Set([1, 2, 3, 4, 5]);

obj.hasOwnProperty('1');
obj.hasOwnProperty(1);
set.has('1');
set.has(1);
javascript
  • A: false true false true
  • B: false true true true
  • C: true true false true
  • D: true true true true
💡 Answer

Answer: C

All object keys (excluding Symbols) are strings under the hood, even if you don't type it yourself as a string. This is why obj.hasOwnProperty('1') also returns true.

It doesn't work that way for a set. There is no '1' in our set: set.has('1') returns false. It has the numeric type 1, set.has(1) returns true.

#Q25. What's the output?

const obj = { a: 'one', b: 'two', a: 'three' };
console.log(obj);
javascript
  • {'A: { a: "one", b: "two" }'}
  • {'B: { b: "two", a: "three" }'}
  • {'C: { a: "three", b: "two" }'}
  • {'D: SyntaxError'}
💡 Answer

Answer: C

If you have two keys with the same name, the key will be replaced. It will still be in its first position, but with the last specified value.

#Q26. The JavaScript global execution context creates two things for you: the global object, and the "this" keyword.

  • A: true
  • B: false
  • C: it depends
  • D: 'SyntaxError'
💡 Answer

Answer: A

The base execution context is the global execution context: it's what's accessible everywhere in your code.

#Q27. What's the output?

for (let i = 1; i < 5; i++) {
  if (i === 3) continue;
  console.log(i);
}
javascript
  • A: 1, 2
  • B: 1, 2, 3
  • C: 1, 2, 4
  • D: 1, 3, 4
💡 Answer

Answer: C

The continue statement skips an iteration if a certain condition returns true.

#Q28. What's the output?

String.prototype.giveLydiaPizza = () => {
  return 'Just give Lydia pizza already!';
};

const name = 'Lydia';

console.log(name.giveLydiaPizza());
javascript
  • A: "Just give Lydia pizza already!"
  • B: TypeError: not a function
  • C: SyntaxError
  • D: undefined
💡 Answer

Answer: A

String is a built-in constructor, which we can add properties to. I just added a method to its prototype. Primitive strings are automatically converted into a string object, generated by the string prototype function. So, all strings (string objects) have access to that method!

#Q29. What's the output?

const a = {};
const b = { key: 'b' };
const c = { key: 'c' };

a[b] = 123;
a[c] = 456;

console.log(a[b]);
javascript
  • A: 123
  • B: 456
  • C: undefined
  • D: ReferenceError
💡 Answer

Answer: B

Object keys are automatically converted into strings. We are trying to set an object as a key to object a, with the value of 123.

However, when we stringify an object, it becomes "[object Object]". So what we are saying here, is that a["[object Object]"] = 123. Then, we can try to do the same again. c is another object that we are implicitly stringifying. So then, a["[object Object]"] = 456.

Then, we log a[b], which is actually a["[object Object]"]. We just set that to 456, so it returns 456.

#Q30. What's the output?

const foo = () => console.log('First');
const bar = () => setTimeout(() => console.log('Second'));
const baz = () => console.log('Third');

bar();
foo();
baz();
javascript
  • A: First, Second, Third
  • B: First, Third, Second
  • C: Second, First, Third
  • D: Second, Third, First
💡 Answer

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.