JavaScript MCQ Practice Part 6

126. What's the output?
function getFine(speed, amount) {
  const formattedSpeed = new Intl.NumberFormat({
    { style: 'unit', unit: 'mile-per-hour' }

  const formattedAmount = new Intl.NumberFormat({
    { style: 'currency', currency: 'USD' }

  return `The driver drove ${formattedSpeed} and has to pay ${formattedAmount}`

console.log(getFine(130, 300))
  • A: The driver drove 130 and has to pay 300
  • B: The driver drove 130 mph and has to pay $300.00
  • C: The driver drove undefined and has to pay undefined
  • D: The driver drove 130.00 and has to pay 300.00

Answer: B

With the Intl.NumberFormat method, we can format numeric values to any locale. We format the numeric value 130 to the en-US locale as a unit in mile-per-hour, which results in 130 mph. The numeric value 300 to the en-US locale as a currentcy in USD results in $300.00.

127. What's the output?
const spookyItems = ['πŸ‘»', 'πŸŽƒ', 'πŸ•Έ'];
({ item: spookyItems[3] } = { item: 'πŸ’€' });

  • A: ["πŸ‘»", "πŸŽƒ", "πŸ•Έ"]
  • B: ["πŸ‘»", "πŸŽƒ", "πŸ•Έ", "πŸ’€"]
  • C: ["πŸ‘»", "πŸŽƒ", "πŸ•Έ", { item: "πŸ’€" }]
  • D: ["πŸ‘»", "πŸŽƒ", "πŸ•Έ", "[object Object]"]

Answer: B

By destructuring objects, we can unpack values from the right-hand object, and assign the unpacked value to the value of the same property name on the left-hand object. In this case, we're assigning the value "πŸ’€" to spookyItems[3]. This means that we're modifying the spookyItems array, we're adding the "πŸ’€" to it. When logging spookyItems, ["πŸ‘»", "πŸŽƒ", "πŸ•Έ", "πŸ’€"] gets logged.

128. What's the output?
const name = 'Lydia Hallie';
const age = 21;


  • A: true false true false
  • B: true false false false
  • C: false false true false
  • D: false true false true

Answer: C

With the Number.isNaN method, you can check if the value you pass is a numeric value and equal to NaN. name is not a numeric value, so Number.isNaN(name) returns false. age is a numeric value, but is not equal to NaN, so Number.isNaN(age) returns false.

With the isNaN method, you can check if the value you pass is not a number. name is not a number, so isNaN(name) returns true. age is a number, so isNaN(age) returns false.

129. What's the output?
const randomValue = 21;

function getInfo() {
  console.log(typeof randomValue);
  const randomValue = 'Lydia Hallie';

  • A: "number"
  • B: "string"
  • C: undefined
  • D: ReferenceError

Answer: D

Variables declared with the const keyword are not referencable before their initialization: this is called the temporal dead zone. In the getInfo function, the variable randomValue is scoped in the functional scope of getInfo. On the line where we want to log the value of typeof randomValue, the variable randomValue isn't initialized yet: a ReferenceError gets thrown! The engine didn't go down the scope chain since we declared the variable randomValue in the getInfo function.

130. What's the output?
const myPromise = Promise.resolve('Woah some cool data');

(async () => {
  try {
    console.log(await myPromise);
  } catch {
    throw new Error(`Oops didn't work`);
  } finally {
    console.log('Oh finally!');
  • A: Woah some cool data
  • B: Oh finally!
  • C: Woah some cool data Oh finally!
  • D: Oops didn't work Oh finally!

Answer: C

In the try block, we're logging the awaited value of the myPromise variable: "Woah some cool data". Since no errors were thrown in the try block, the code in the catch block doesn't run. The code in the finally block always runs, "Oh finally!" gets logged.

131. What's the output?
const emojis = ['πŸ₯‘', ['✨', '✨', ['πŸ•', 'πŸ•']]];

  • A: ['πŸ₯‘', ['✨', '✨', ['πŸ•', 'πŸ•']]]
  • B: ['πŸ₯‘', '✨', '✨', ['πŸ•', 'πŸ•']]
  • C: ['πŸ₯‘', ['✨', '✨', 'πŸ•', 'πŸ•']]
  • D: ['πŸ₯‘', '✨', '✨', 'πŸ•', 'πŸ•']

Answer: B

With the flat method, we can create a new, flattened array. The depth of the flattened array depends on the value that we pass. In this case, we passed the value 1 (which we didn't have to, that's the default value), meaning that only the arrays on the first depth will be concatenated. ['πŸ₯‘'] and ['✨', '✨', ['πŸ•', 'πŸ•']] in this case. Concatenating these two arrays results in ['πŸ₯‘', '✨', '✨', ['πŸ•', 'πŸ•']].

132. What's the output?
class Counter {
  constructor() {
    this.count = 0;

  increment() {

const counterOne = new Counter();

const counterTwo = counterOne;

  • A: 0
  • B: 1
  • C: 2
  • D: 3

Answer: D

counterOne is an instance of the Counter class. The counter class contains a count property on its constructor, and an increment method. First, we invoked the increment method twice by calling counterOne.increment(). Currently, counterOne.count is 2.

Then, we create a new variable counterTwo, and set it equal to counterOne. Since objects interact by reference, we're just creating a new reference to the same spot in memory that counterOne points to. Since it has the same spot in memory, any changes made to the object that counterTwo has a reference to, also apply to counterOne. Currently, counterTwo.count is 2.

We invoke the counterTwo.increment(), which sets the count to 3. Then, we log the count on counterOne, which logs 3.

133. What's the output?
const myPromise = Promise.resolve(Promise.resolve('Promise!'));

function funcOne() {
  myPromise.then(res => res).then(res => console.log(res));
  setTimeout(() => console.log('Timeout!', 0));
  console.log('Last line!');

async function funcTwo() {
  const res = await myPromise;
  console.log(await res);
  setTimeout(() => console.log('Timeout!', 0));
  console.log('Last line!');

  • A: Promise! Last line! Promise! Last line! Last line! Promise!
  • B: Last line! Timeout! Promise! Last line! Timeout! Promise!
  • C: Promise! Last line! Last line! Promise! Timeout! Timeout!
  • D: Last line! Promise! Promise! Last line! Timeout! Timeout!

Answer: D

First, we invoke funcOne. On the first line of funcOne, we call the myPromise promise, which is an asynchronous operation. While the engine is busy completing the promise, it keeps on running the function funcOne. The next line is the asynchronous setTimeout function, from which the callback is sent to the Web API. (see my article on the event loop here.)

Both the promise and the timeout are asynchronous operations, the function keeps on running while it's busy completing the promise and handling the setTimeout callback. This means that Last line! gets logged first, since this is not an asynchonous operation. This is the last line of funcOne, the promise resolved, and Promise! gets logged. However, since we're invoking funcTwo(), the call stack isn't empty, and the callback of the setTimeout function cannot get added to the callstack yet.

In funcTwo we're, first awaiting the myPromise promise. With the await keyword, we pause the execution of the function until the promise has resolved (or rejected). Then, we log the awaited value of res (since the promise itself returns a promise). This logs Promise!.

The next line is the asynchronous setTimeout function, from which the callback is sent to the Web API.

We get to the last line of funcTwo, which logs Last line! to the console. Now, since funcTwo popped off the call stack, the call stack is empty. The callbacks waiting in the queue (() => console.log("Timeout!") from funcOne, and () => console.log("Timeout!") from funcTwo) get added to the call stack one by one. The first callback logs Timeout!, and gets popped off the stack. Then, the second callback logs Timeout!, and gets popped off the stack. This logs Last line! Promise! Promise! Last line! Timeout! Timeout!

134. How can we invoke sum in index.js from sum.js?
// sum.js
export default function sum(x) {
  return x + x;

// index.js
import * as sum from './sum';
  • A: sum(4)
  • B: sum.sum(4)
  • C: sum.default(4)
  • D: Default aren't imported with *, only named exports

Answer: C

With the asterisk *, we import all exported values from that file, both default and named. If we had the following file:

// info.js
export const name = 'Lydia';
export const age = 21;
export default 'I love JavaScript';

// index.js
import * as info from './info';

The following would get logged:

  default: "I love JavaScript",
  name: "Lydia",
  age: 21

For the sum example, it means that the imported value sum looks like this:

{ default: function sum(x) { return x + x } }

We can invoke this function, by calling sum.default

135. What's the output?
const handler = {
  set: () => console.log('Added a new property!'),
  get: () => console.log('Accessed a property!'),

const person = new Proxy({}, handler); = 'Lydia';;
  • A: Added a new property!
  • B: Accessed a property!
  • C: Added a new property! Accessed a property!
  • D: Nothing gets logged

Answer: C

With a Proxy object, we can add custom behavior to an object that we pass to it as the second argument. In tis case, we pass the handler object which contained to properties: set and get. set gets invoked whenever we set property values, get gets invoked whenever we get (access) property values.

The first argument is an empty object {}, which is the value of person. To this object, the custom behavior specified in the handler object gets added. If we add a property to the person object, set will get invoked. If we access a property on the person object, get gets invoked.

First, we added a new property name to the proxy object ( = "Lydia"). set gets invoked, and logs "Added a new property!".

Then, we access a property value on the proxy object, the get property on the handler object got invoked. "Accessed a property!" gets logged.

136. Which of the following will modify the person object?
const person = { name: 'Lydia Hallie' };

  • A: = "Evan Bacon"
  • B: person.age = 21
  • C: delete
  • D: Object.assign(person, { age: 21 })

Answer: A

With Object.seal we can prevent new properies from being added, or existing properties to be removed.

However, you can still modify the value of existing properties.

137. Which of the following will modify the person object?
const person = {
  name: 'Lydia Hallie',
  address: {
    street: '100 Main St',

  • A: = "Evan Bacon"
  • B: delete person.address
  • C: person.address.street = "101 Main St"
  • D: = { name: "Mara" }

Answer: C

The Object.freeze method freezes an object. No properties can be added, modified, or removed.

However, it only shallowly freezes the object, meaning that only direct properties on the object are frozen. If the property is another object, like address in this case, the properties on that object aren't frozen, and can be modified.

138. What's the output?
const add = x => x + x;

function myFunc(num = 2, value = add(num)) {
  console.log(num, value);

  • A: 2 4 and 3 6
  • B: 2 NaN and 3 NaN
  • C: 2 Error and 3 6
  • D: 2 4 and 3 Error

Answer: A

First, we invoked myFunc() without passing any arguments. Since we didn't pass arguments, num and value got their default values: num is 2, and value the returned value of the function add. To the add function, we pass num as an argument, which had the value of 2. add returns 4, which is the value of value.

Then, we invoked myFunc(3) and passed the value 3 as the value for the argument num. We didn't pass an argument for value. Since we didn't pass a value for the value argument, it got the default value: the returned value of the add function. To add, we pass num, which has the value of 3. add returns 6, which is the value of value.

139. What's the output?
class Counter {
  #number = 10

  increment() {

  getNum() {
    return this.#number

const counter = new Counter()

  • A: 10
  • B: 11
  • C: undefined
  • D: SyntaxError

Answer: D

In ES2020, we can add private variables in classes by using the #. We cannot access these variables outside of the class. When we try to log counter.#number, a SyntaxError gets thrown: we cannot acccess it outside the Counter class!

140. What's the missing?
const teams = [
  { name: 'Team 1', members: ['Paul', 'Lisa'] },
  { name: 'Team 2', members: ['Laura', 'Tim'] },

function* getMembers(members) {
  for (let i = 0; i < members.length; i++) {
    yield members[i];

function* getTeams(teams) {
  for (let i = 0; i < teams.length; i++) {

const obj = getTeams(teams);; // { value: "Paul", done: false }; // { value: "Lisa", done: false }
  • A: yield getMembers(teams[i].members)
  • B: yield* getMembers(teams[i].members)
  • C: return getMembers(teams[i].members)
  • D: return yield getMembers(teams[i].members)

Answer: B

In order to iterate over the members in each element in the teams array, we need to pass teams[i].members to the getMembers generator function. The generator function returns a generator object. In order to iterate over each element in this generator object, we need to use yield*.

If we would've written yield, return yield, or return, the entire generator function would've gotten returned the first time we called the next method.

141. What's the output?
const person = {
  name: 'Lydia Hallie',
  hobbies: ['coding'],

function addHobby(hobby, hobbies = person.hobbies) {
  return hobbies;

addHobby('running', []);
addHobby('baking', person.hobbies);

  • A: ["coding"]
  • B: ["coding", "dancing"]
  • C: ["coding", "dancing", "baking"]
  • D: ["coding", "running", "dancing", "baking"]

Answer: C

The addHobby function receives two arguments, hobby and hobbies with the default value of the hobbies array on the person object.

First, we invoke the addHobby function, and pass "running" as the value for hobby and an empty array as the value for hobbies. Since we pass an empty array as the value for y, "running" gets added to this empty array.

Then, we invoke the addHobby function, and pass "dancing" as the value for hobby. We didn't pass a value for hobbies, so it gets the default value, the hobbies property on the person object. We push the hobby dancing to the person.hobbies array.

Last, we invoke the addHobby function, and pass "bdaking" as the value for hobby, and the person.hobbies array as the value for hobbies. We push the hobby baking to the person.hobbies array.

After pushing dancing and baking, the value of person.hobbies is ["coding", "dancing", "baking"]

142. What's the output?
class Bird {
  constructor() {
    console.log("I'm a bird. 🦒");

class Flamingo extends Bird {
  constructor() {
    console.log("I'm pink. 🌸");

const pet = new Flamingo();
  • A: I'm pink. 🌸
  • B: I'm pink. 🌸 I'm a bird. 🦒
  • C: I'm a bird. 🦒 I'm pink. 🌸
  • D: Nothing, we didn't call any method

Answer: B

We create the variable pet which is an instance of the Flamingo class. When we instantiate this instance, the constructor on Flamingo gets called. First, "I'm pink. 🌸" gets logged, after which we call super(). super() calls the constructor of the parent class, Bird. THe constructor in Bird gets called, and logs "I'm a bird. 🦒".

143. Which of the options result(s) in an error?
const emojis = ['πŸŽ„', 'πŸŽ…πŸΌ', '🎁', '⭐'];

/* 1 */ emojis.push('🦌');
/* 2 */ emojis.splice(0, 2);
/* 3 */ emojis = [...emojis, 'πŸ₯‚'];
/* 4 */ emojis.length = 0;
  • A: 1
  • B: 1 and 2
  • C: 3 and 4
  • D: 3

Answer: D

The const keyword simply means we cannot redeclare the value of that variable, it's read-only. However, the value itself isn't immutable. The propeties on the emojis array can be modified, for example by pushing new values, splicing them, or setting the length of the array to 0.

144. What do we need to add to the person object to get ["Lydia Hallie", 21] as the output of [...person]?
const person = {
  name: "Lydia Hallie",
  age: 21

[...person] // ["Lydia Hallie", 21]
  • A: Nothing, object are iterable by default
  • B: *[Symbol.iterator]() { for (let x in this) yield* this[x] }
  • C: *[Symbol.iterator]() { yield* Object.values(this) }
  • D: *[Symbol.iterator]() { for (let x in this) yield this }

Answer: C

Objects aren't iterable by default. An iterable is an iterable if the iterator protocol is present. We can add this manually by adding the iterator symbol [Symbol.iterator], which has to return a generator object, for example by making it a generator function *[Symbol.iterator]() {}. This generator function has to yield the Object.values of the person object if we want it to return the array ["Lydia Hallie", 21]: yield* Object.values(this).

146. What's the output?
let count = 0;
const nums = [0, 1, 2, 3];

nums.forEach(num => {
	if (num) count += 1

  • A: 1
  • B: 2
  • C: 3
  • D: 4

Answer: C

The if condition within the forEach loop checks whether the value of num is truthy or falsy. Since the first number in the nums array is 0, a falsy value, the if statement's code block won't be executed. count only gets incremented for the other 3 numbers in the nums array, 1, 2 and 3. Since count gets incremented by 1 3 times, the value of count is 3.

147. What's the output?
function getFruit(fruits) {

getFruit([['🍊', '🍌'], ['🍍']])
getFruit([['🍍'], ['🍊', '🍌']])
  • A: null, undefined, 🍌
  • B: [], null, 🍌
  • C: [], [], 🍌
  • D: undefined, undefined, 🍌

Answer: D

The ? allows us to optionally access deeper nested properties within objects. We're trying to log the item on index 1 within the subarray that's on index 1 of the fruits array. If the subarray on index 1 in the fruits array doesn't exist, it'll simply return undefined. If the subarray on index 1 in the fruits array exists, but this subarray doesn't have an item on its 1 index, it'll also return undefined.

First, we're trying to log the second item in the ['🍍'] subarray of [['🍊', '🍌'], ['🍍']]]. This subarray only contains one item, which means there is no item on index 1, and returns undefined.

Then, we're invoking the getFruits function without passing a value as an argument, which means that fruits has a value of undefined by default. Since we're conditionally chaining the item on index 1 offruits, it returns undefined since this item on index 1 does not exist.

Lastly, we're trying to log the second item in the ['🍊', '🍌'] subarray of ['🍍'], ['🍊', '🍌']. The item on index 1 within this subarray is 🍌, which gets logged.

148. What's the output?
class Calc {
	constructor() {
		this.count = 0 

	increase() {
		this.count ++

const calc = new Calc()
new Calc().increase()

  • A: 0
  • B: 1
  • C: undefined
  • D: ReferenceError

Answer: A

We set the variable calc equal to a new instance of the Calc class. Then, we instantiate a new instance of Calc, and invoke the increase method on this instance. Since the count property is within the constructor of the Calc class, the count property is not shared on the prototype of Calc. This means that the value of count has not been updated for the instance calc points to, count is still 0.

149. What's the output?
const user = {
	email: "",
	password: "12345"

const updateUser = ({ email, password }) => {
	if (email) {
		Object.assign(user, { email })

	if (password) {
		user.password = password

	return user

const updatedUser = updateUser({ email: "" })

console.log(updatedUser === user)
  • A: false
  • B: true
  • C: TypeError
  • D: ReferenceError

Answer: B

The updateUser function updates the values of the email and password properties on user, if their values are passed to the function, after which the function returns the user object. The returned value of the updateUser function is the user object, which means that the value of updatedUser is a reference to the same user object that user points to. updatedUser === user equals true.

150. What's the output?
const fruit = ['🍌', '🍊', '🍎']

fruit.slice(0, 1)
fruit.splice(0, 1)
  • A: ['🍌', '🍊', '🍎']
  • B: ['🍊', '🍎']
  • C: ['πŸ‡', '🍊', '🍎']
  • D: ['πŸ‡', '🍌', '🍊', '🍎']

Answer: C

First, we invoke the slice method on the fruit array. The slice method does not modify the original array, but returns the value that it sliced off the array: the banana emoji. Then, we invoke the splice method on the fruit array. The splice method does modify the original array, which means that the fruit array now consists of ['🍊', '🍎']. At last, we invoke the unshift method on the fruit array, which modifies the original array by adding the provided value, β€˜πŸ‡β€™ in this case, as the first element in the array. The fruit array now consists of ['πŸ‡', '🍊', '🍎'].

151. What's the output?
const animals = {};
let dog = { emoji: '🐢' }
let cat = { emoji: '🐈' }

animals[dog] = {, name: "Mara" }
animals[cat] = {, name: "Sara" }

  • A: { emoji: "🐢", name: "Mara" }
  • B: { emoji: "🐈", name: "Sara" }
  • C: undefined
  • D: ReferenceError

Answer: B

Object keys are converted to strings.

Since the value of dog is an object, animals[dog] actually means that we’re creating a new property called "object Object" equal to the new object. animals["object Object"] is now equal to { emoji: "🐢", name: "Mara"}.

cat is also an object, which means that animals[cat] actually means that we’re overwriting the value of animals[``"``object Object``"``] with the new cat properties.

Logging animals[dog], or actually animals["object Object"] since converting the dog object to a string results "object Object", returns the { emoji: "🐈", name: "Sara" }.

152. What's the output?
const user = {
	email: "",
	updateEmail: email => { = email

  • A:
  • B:
  • C: undefined
  • D: ReferenceError

Answer: A

The updateEmail function is an arrow function, and is not bound to the user object. This means that the this keyword is not referring to the user object, but refers to the global scope in this case. The value of email within the user object does not get updated. When logging the value of, the original value of gets returned.

153. What's the output?
const promise1 = Promise.resolve('First')
const promise2 = Promise.resolve('Second')
const promise3 = Promise.reject('Third')
const promise4 = Promise.resolve('Fourth')

const runPromises = async () => {
	const res1 = await Promise.all([promise1, promise2])
	const res2  = await Promise.all([promise3, promise4])
	return [res1, res2]

	.then(res => console.log(res))
	.catch(err => console.log(err))
  • A: [['First', 'Second'], ['Fourth']]
  • B: [['First', 'Second'], ['Third', 'Fourth']]
  • C: [['First', 'Second']]
  • D: 'Third'

Answer: D

The Promise.all method runs the passed promises in parallel. If one promise fails, the Promise.all method _rejects) with the value of the rejected promise. In this case, promise3 rejected with the value "Third". We’re catching the rejected value in the chained catch method on the runPromises invocation to catch any errors within the runPromises function. Only "Third" gets logged, since promise3 rejected with this value.

154. What should the value of method be to log { name: "Lydia", age: 22 }?
const keys = ["name", "age"]
const values = ["Lydia", 22]

const method = /* ?? */
Object[method](, i) => {
	return [keys[i], values[i]]
})) // { name: "Lydia", age: 22 }
  • A: entries
  • B: values
  • C: fromEntries
  • D: forEach

Answer: C

The fromEntries method turns a 2d array into an object. The first element in each subarray will be the key, and the second element in each subarray will be the value. In this case, we’re mapping over the keys array, which returns an array which first element is the item on the key array on the current index, and the second element is the item of the values array on the current index.

This creates an array of subarrays containing the correct keys and values, which results in { name: "Lydia", age: 22 }

155. What's the output?
const createMember = ({ email, address = {}}) => {
	const validEmail = /.+\@.+\..+/.test(email)
	if (!validEmail) throw new Error("Valid email pls")

	return {
		address: address ? address : null

const member = createMember({ email: "" })
  • A: { email: "", address: null }
  • B: { email: "" }
  • C: { email: "", address: {} }
  • D: { email: "", address: undefined }

Answer: C

The default value of address is an empty object {}. When we set the variable member equal to the object returned by the createMember function, we didn't pass a value for address, which means that the value of address is the default empty object {}. An empty object is a truthy value, which means that the condition of the address ? address : null conditional returns true. The value of address is the empty object {}.

156. What's the output?
let randomValue = { name: "Lydia" }
randomValue = 23

if (!typeof randomValue === "string") {
	console.log("It's not a string!")
} else {
	console.log("Yay it's a string!")
  • A: It's not a string!
  • B: Yay it's a string!
  • C: TypeError
  • D: undefined

Answer: B

The condition within the if statement checks whether the value of !typeof randomValue is equal to "string". The ! operator converts the value to a boolean value. If the value is truthy, the returned value will be false, if the value is falsy, the returned value will be true. In this case, the returned value of typeof randomValue is the truthy value "string", meaning that the value of !typeof randomValue is the boolean value false.

!typeof randomValue === "string" always returns false, since we're actually checking false === "string". Since the condition returned false, the code block of the else statement gets run, and Yay it's a string! gets logged.

Site developed by Nikhil Karkra Β© 2021 | Icons made by Freepik