Originally published on Pitayan | What do these console.log print out?

Come to the original site for a better reading experience.

These days, I was preparing a small game for our team's tech workshop. Thought it'd be a good opportunity of introducing the some fundamental and tricky stuffs around JavaScript. So I made 8 quiz to our team members. And hope they could solve them within 15 min. Eventually, it took all of them over 20 minutes to complete and most of them could solve 4-5 questions correctly.

You can take it as just a small test, each quiz has answer attached to the end of the code. Try to answer them first and then look at the answers. Good luck.

#What do these console.log print out?

#No. 1 -- Doctor Pavlov has a dog

function Animal(){ 
  this.type = "animal"
}

function Dog(){ 
  this.name = "dog"
}

Dog.prototype = new Animal()

var PavlovPet = new Dog(); 

console.log(PavlovPet. __proto__ === Dog.prototype)
console.log(Dog.prototype. __proto__ === Animal.prototype)

Answer for No. 1

Very basic stuff about the prototype chain.

// Output
true
true

#No. 2 -- Be careful with the "sort"

var arr = [5, 22, 14, 9];

console.log(arr.sort());

Answer for No. 2

Sorry, not [5, 9, 14, 22]. Each element is converted into string and then comparing the sequence of UTF-16 value.

Check this out: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

// Output
[14, 22, 5, 9]

#No. 3 -- Closure and event loop

for (var i = 0; i < 3; i++) {
  const log = () => {
    console.log(i)
  }
  setTimeout(log, 100)
}

Answer for No. 3

It prints out 3 thrice since setTimout puts that log function to the next macro task queue

// Output
3
3
3

#No. 4 -- There's indentation

function createNewArray(item) {
  return
    [item]
}

console.log(createNewArray(0))

Answer for No. 4

This causes an error. Can't return value with break-line and indentation together

Uncaught SyntaxError: Invalid or unexpected token

#No. 5 -- What's inside the "numbers"

const length = 4
const numbers = []
for (var i = 0; i < length; i++);{
  numbers.push(i + 1)
}

console.log(numbers)

Answer for No. 5

This needs a pair of sharp eyes. See that semicolon between the parentheses and curly bracket?

// Output
[5]

#No. 6 -- No length

const clothes = ['shirt', 'socks', 'jacket', 'pants', 'hat']
clothes.length = 0

console.log(clothes[3])

Answer for No. 3

This is equivalant to removing all elements from the array

// Output
undefined

#No. 7 -- Variable went crazy

var a = 1
function output () {
    console.log(a)
    var a = 2
    console.log(a)
}
console.log(a)
output()
console.log(a)

Answer for No. 7

First output: using the global var a

Second output: the first one in the function output() using before declaration should be undefined

Third output: print out after the declaration. Nothing special.

Forth output: var a never got changed by function output()

// Output
1
undefined
2
1

#No. 8 -- There's an accidental declaration

function foo() {
    let a = b = 0
    a++
    return a
}

foo()
console.log(typeof a)
console.log(typeof b)

Answer for No. 3

let a is a local variable. typeof a is checking undeclared variable.

b is a global variable which value is assign in function foo().

// Output
undefined
number

#In the end

Thanks so much for reading! Have you got them all correct?