Welcome

Welcome to CMS n Web. Learn & Study completely Free Articles\Training about Web Designing\Development and CMS.

Search This Web

Monday, March 10, 2014

JavaScript quiz from Perfection Kills

I came across this JavaScript quiz on a very cool blog and since I really enjoy solving such problems, I took the quiz. The result was humbling, and I was eager to find out why I got some of the questions wrong. I figured out why each problem behaves the way it does so I put them together for others below.

1
2
3
1. (function(){
      return typeof arguments;
    })();
(a) “object” (b) “array” (c) “arguments” (d) “undefined”
The answer is (a). The arguments array is of type “object”. My first instinct was to think its an array, until I realized there was a typeof to be considered.
1
2
2. var f = function g(){ return 23; };
    typeof g();
(a) “number” (b) “undefined” (c) “function” (d) Error
This results in an error because the function g has been assigned to the var f. So the answer is (d)
1
2
3
4
3. (function(x){
      delete x;
      return x;
    })(1);
(a) 1 (b) null (c) undefined (d) Error
I made the mistake of assuming I could delete x, but apparently you cannot delete arguments inside a function. So the answer is 1 which is option (a).
1
2
4. var y = 1, x = y = typeof x;
    x;
(a) 1 (b) “number” (c) undefined (d) “undefined”
The answer here is “number”, because after assigning a value of 1 to y, x is also assigned that value. Doing a typeof on 1 obviously yields “number”.
1
2
3
5. (function f(f){
      return typeof f();
    })(function(){ return 1; });
(a) “number” (b) “undefined” (c) “function” (d) Error
Notice that we pass a function which returns 1 to the function f, which inturn executes the passed function and evaluates the type of the returned value. So typeof 1 results in “number” which is option (a)
1
2
3
4
5
6
7
6. var foo = {
     bar: function() { return this.baz; },
     baz: 1
   };
   (function(){
     return typeof arguments[0]();
   })(foo.bar);
(a) “undefined” (b) “object” (c) “number” (d) “function”
This returns “undefined” because when the foo.bar function is executed, “this” refers to the window scope which ofcourse knows nothing about baz. How do you fix this?
Remember how to use JavaScript’s call() and apply()? If not, check here
In this case, we need to specify the “this” to be the object “foo”, like this:
1
2
3
4
5
6
7
var foo = {    
     bar: function() { return this.baz; },
     baz: 1
   };
   (function(){
     return typeof arguments[0].call(foo);
   })(foo.bar);
1
2
3
4
5
7.  var foo = {
      bar: function(){ return this.baz; },
      baz: 1
    }
    typeof (f = foo.bar)();
(a) “undefined” (b) “object” (c) “number” (d) “function”
The above returns “undefined” because assigning foo.bar to a global variable “f” means the value of “this” inside foo.bar is “window”, and again, since window would not have a baz property, the value is undefined.
1
2
8. var f = (function f(){ return "1"; }, function g(){ return 2; })();
   typeof f;
(a) “string” (b) “number” (c) “function” (d) “undefined”
This one tripped me up! The comma apparently executes the function on its right. “,” is a left-associative operator which returns the value on its right, which makes the above to be var f = 2. typeof 2 will return “number” which is option (b).
1
2
3
4
5
9. var x = 1;
   if (function f(){}) {
     x += typeof f;
   }
   x;
(a) 1 (b) “1function” (c) “1undefined” (d) NaN
This returns “1undefined” because x+ typeof f where “f” is undefined returns 1 + “undefined” = “1undefined”. Also note how if(function(){}) evaluated to true.
1
2
10.  var x = [typeof x, typeof y][1];
    typeof typeof x;
(a) “number” (b) “string” (c) “undefined” (d) “object”
typeof “y” which is undefined returns “undefined”, typeof “undefined” is “string”, and another typeof on it still returns “string”.
1
2
3
11. (function(foo){
      return typeof foo.bar;
    })({ foo: { bar: 1 } });
(a) “undefined” (b) “object” (c) “number” (d) Error
This one is simple, typeof foo.bar is a trick question because the argument foo is just an object, so to really get the “bar” value, it has to be typeof foo.foo.bar in this case. Either way, the answer is “undefined”.
1
2
3
4
5
12. (function f(){
      function f(){ return 1; }
      return f();
      function f(){ return 2; }
    })();
(a) 1 (b) 2 (c) Error (e.g. “Too much recursion”) (d) undefined
I made the mistake of thinking the value is 1, but if you pay careful attention, you’ll realize both functions are called f, which means when return f() executes, function returns value 2 because its been parsed second. So the answer is “2″.
1
2
13. function f(){ return f; }
    new f() instanceof f;
(a) true (b) false
This evaluates to false because new f() returns a function which is not an instanceof the function f.
1
14. with (function(x, undefined){}) length;
(a) 1 (b) 2 (c) undefined (d) Error
This evaluates to 2, because the functions length is the number of expected arguments.

ref: http://vikasrao.wordpress.com/2011/08/25/javascript-quiz-from-perfection-kills/