Skip to content

Instantly share code, notes, and snippets.

@jesspoemape
Last active March 4, 2024 11:07
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 7 You must be signed in to fork a gist
  • Save jesspoemape/87665d65cde3980485ec27cef1602a0d to your computer and use it in GitHub Desktop.
Save jesspoemape/87665d65cde3980485ec27cef1602a0d to your computer and use it in GitHub Desktop.
An explanation of David Shariff's Javascript quiz

See the original quiz here

Question 1

var foo = function foo() {
    console.log(foo === foo);  
};
foo();

Answer: true

Since the function declaration doesn't start with the word function, we call this a function expression. You can declare functions like this to make an anonymous function (ie. var myFunction = function() {...}), but you can also name it, like what is going on in this question. We have a function expression called foo that defines a function also called foo. So you can think of it as "Is the variable foo equal to the function foo in both value and type?", and the answer would be yes.

Question 2

function aaa() {
    return
    {
        test: 1
    };
}
alert(typeof aaa());

Answer: undefined

My initial thought was that the answer was object, but take a close look at that return statement. Notice that the object is on the line after the word return. Since Javscript expects a semicolon at the end of every line, it inserts one after return, making the function return nothing. So the data type of the invoked function is undefined.

Question 3

Number("1") - 1 == 0;

Answer: true

The Number constructor converts the argument passed to it into a number, so think of the question as being 1 - 1 == 0. This is obviously true.

Question 4

(true + false) > 2 + true;

Answer: false

Remember that Javscript is agressive about type coercion, so it converts true to 1 and false to 0 to add them. Think of the question as being 1 + 0 > 2 + 1 or 1 > 3, which is false.

Question 5

function bar() {
    return foo;
    foo = 10;
    function foo() {}
    var foo = '11';
}
alert(typeof bar());

Answer: function

I had to do some more research to fully understand what was going on here. My initial thought was that the answer to this has to do with hoisting. The key thing to remember about hoisting is that declarations are hoisted and initializations are not hoisted. Let's break the question down line by line:

  • Line 3, foo is initialized as a global variable (fun fact: declaring a variable without the var, let or const keyword makes it a global variable, but don't ever do this.)
  • Line 4 is a function declaration. This is hoisted to the top.
  • Line 5 is a variable initialization. This is not hoisted. Since the function declaration is hoisted to the top, the return value is function because the other two variables are esentially unreachable after the return statement.

Question 6

"1" - - "1";

Answer: 2

Think back to your middle school math days. What happens when you add a positive number and a negative number? Now keeping that in mind, remember that Javscript is agressive about type coercion. Thinking of the question as being 1 - (-1) or even 1 + 1 makes easier to figure out. ;)

Question 7

var x = 3;

var foo = {
    x: 2,
    baz: {
        x: 1,
        bar: function() {
            return this.x;
        }
    }
}

var go = foo.baz.bar;

alert(go());
alert(foo.baz.bar());

Answer: 3, 1

This one is killer. Get it? This one. Anyways. The point of this question is to test your knowledge of the this keyword. this gets its context from the object that invokes it. The first time (go), it is invoked by the body, so x = 3. The second time (foo.baz.bar), bar is invoked from within the object, so x = 1.

Question 8

new String("This is a string") instanceof String;

Answer: true

The instanceof operator tests whether an object in its prototype chain has the prototype property of a constructor (ie. Was the string made using the String constructor with the new keyword? Hint: It was.)

Question 9

[] + [] + 'foo'.split('');

Answer: 'f,o,o'

Yet another question about Javscript type coercion. First, the foo.split method splits a string into an array of values with the requested separator (in this case, an empty string). Next, there are two things a plus sign does in Javscript: it adds or it concatonates. Since an array is not a number, it concatonates the empty arrays (which are converted into empty strings) with 'foo' (which originally was a string). So now the question looks like this: '' + '' + 'foo'.split('').

Question 10

new Array(5).toString();

Answer: ',,,,'

The Array constructor might be something new to you. There are two ways you can use the Array constructor: new Array(element1, element2, ..., elementN) or new Array(arrayLength). Do you know the answer yet? We made an array with a length of 5 with no values, so when we used the toString method, we get a string of no values separated by commas or ',,,,'.

Question 11

var myArr = ['foo', 'bar', 'baz'];
myArr.length = 0;
myArr.push('bin');
console.log(myArr);

Answer: ['bin']

One of the ways to empty an array is to set the length equal to 0. THat's what is happening in Line 2. Pushing the value 'bin' to the empty array produces an array with 'bin' as its only element.

Question 12

String('Hello') === 'Hello';

Answer: true

Don't think too hard with this one. The string constructor converts the value of the object passed in to a string. And is the string 'Hello' equal in type and value to the string 'Hello'? Well, obviously yes.

Question 13

var x = 0;
function foo() {
    x++;
    this.x = x;
    return foo;
}
var bar = new new foo;
console.log(bar.x);

Answer: undefined

Erm...check back later. I'm not sure how to explain this one.

Question 14

"This is a string" instanceof String;

Answer: false

Look back on the explanation for Question 8. Notice that the string constructor was not used here. Since the string was not created using a constructor, it is not an instance of string.

Question 15

var bar = 1,
    foo = {};

foo: {
    bar: 2;
    baz: ++bar;
}
foo.baz + foo.bar + bar;

Answer: NaN

Notice that the foo object is only ever assigned a value at the beginning. The second block of code doesn't add properties to the foo object because it only contains labelled statements, not assignments (notice that they end with a semicolon and not a comma). So adding undefined variables to 1 results in Nan.

Question 16

var myArr = ['foo', 'bar', 'baz'];
myArr[2];
console.log('2' in myArr);

Answer: true

Remember that an array is an indexxed list of items. The console log is asking, "Is there a value at index 2 of myArr"? Which is true. To test this theory, ask for '4' in myArr. It returns false.

Question 17

var arr = [];
arr[0]  = 'a';
arr[1]  = 'b';
arr.foo = 'c';
alert(arr.length); 

Answer: 2

You can add items to an array by setting an index equal to a value. You can also add properties like foo to an array, but it won't change the contents or length of the array. Try accessing arr.foo, and it will return c.

Question 18

// 10 > 9 > 8 === true;

Answer: false

Remember that JS loves to coerce types. Moving one step at a time, is 10 > 9? Yes, or true. So now that expression is true > 8? This is false. Binary true (or 1) is not greater than 8. So finally, we are seeing if false === true, which is false.

Question 19

function foo(a, b) {
    arguments[1] = 2;
    alert(b);
}
foo(1);

Answer: undefined

The function foo is defined as needing 2 arguments (a and b). If you don't supply all the arguments when invoking the function, JS automatically sets the missing arguments to undefined. You can access the arguments passed to a function using the arguments property of a function. Since the argument at index 1 is undefined, you can't set it to equal a number. If you provide a second argument when invoking the function, it will alert 2, as expected.

Question 20

NaN === NaN;

Answer: false

Fun Fact: NaN is an object in JS! Another fun fact: you can't compare objects for equality in JS! To see if something is NaN, use isNan.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment