JavaScript Basics Quiz

Let's look at some JavaScript questions.

Question 1

What's the output.

1x = 90;
2function f() {
3  console.log(x);
4  var x = 100;
5}
6f();
Copy

Answer 1

The result is undefined . In JavaScript a variable exists in the scope of a function and that variable can be defined anywhere in the function. To find out more about lexical scope read here and here .

Question 2

Go to prototype homepage open firebug and execute following code.

1var a = ["a", "b", "c"];
2var result = "\n";
3for (i in a) {
4  result += "index: " + i + " value:" + a[i] + "\n";
5}
Copy

Now go to jQuery homepage and execute the same code. Notice the difference in output. Why the difference?

Answer 2

Prototype adds additional methods to Array using Array.prototype . Those methods show up when you iterate through them. If you want to ignore methods added through Array.prototype then use this code.

1var a = ["a", "b", "c"];
2var result = "\n";
3for (i in a) {
4  if (a.hasOwnProperty(i)) result += "index: " + i + " value:" + a[i] + "\n";
5}
Copy

Question 3

In order to find if an element with id foo is present, one can do

1if ($("#foo").length > 0) console.log("id foo is present");
Copy

How can you make the conditional statement shorter.

Answer 3

In JavaScript following items evaluate to false in a conditional statement: undefined, null, false, empty string, NaN, 0

1if ($("#foo")) console.log("id foo is present");
Copy

Question 4

What is the output in this case. Notice that function bar is defined after the return statement.

1function foo() {
2  console.log(z);
3  console.log(bar());
4  return true;
5
6  function bar() {
7    return "this is bar";
8  }
9
10  var z = "zzz";
11}
12
13foo();
Copy

Answer 4

Output is

1undefined
2this is bar
3true
Copy

Question 5

What's output in this case.

1function logit(n) {
2  console.log(n);
3}
4
5for (i = 1; i < 5; i++) {
6  setInterval(function () {
7    logit(i);
8  }, 2000);
9}
Copy

Answer 5

The result would be output 5 5 5 5 and all the four output will appear together in one shot. Then after 2 seconds another set of similar data would appear. This would continue forever.

Question is why do I see the output in one single shot and why do I see value 5 for all four cases.

Browsers execute JavaScript in a single thread. While that thread is busy executing 'for loop' the thread makes note of additional instructions like setInterval. Since the thread is already running 'for loop', the same thread can't run setInterval. So the thread finishes the 'for loop' and then looks up additional tasks to be performed. It find setInterval task to be waiting. It executes the function. While it is executing the function ,by virtue of closure, the value of i is 5. Hence you see 5 5 5 5 and you see all that in one single shot.

Correct implementation would be

1function logit(n) {
2  console.log(n);
3}
4
5var counter = 0;
6var timer = setInterval(function () {
7  logit(counter);
8  counter++;
9  if (counter == 5) {
10    clearTimeout(timer);
11  }
12}, 2000);
Copy

Above code would print 0 1 2 3 4 at an interval of 2 seconds.

Question 6

What's the output in this case.

1flight = { status: "arrived" };
2console.log(typeof flight.status);
3console.log(typeof flight.toString);
4console.log(flight.hasOwnProperty("status"));
5console.log(flight.hasOwnProperty("toString"));
Copy

Answer 6

1string
2function
3true
4false
Copy

Question 7

What's output in this case.

1function Person(name) {
2  this.name = name;
3}
4Person.prototype.welcome = function () {
5  return "welcome " + this.name;
6};
7
8p = new Person("John");
9
10console.log(p.welcome.call(p));
11
12o = { name: "Mary" };
13
14console.log(Person.prototype.welcome.call(o));
Copy

Answer 7

1welcome John
2welcome Mary
Copy

Question 8

JavaScript has Math library which can be used like this

1Math.max(6, 7, 8); // result is 8
Copy

If I provide an array with certain values then how would you find the max value for that array.

1a = [1, 2, 3];
Copy

Answer 8

This answer builds up on the answer provided in #7 .

You can try this but it will fail.

1Math.max(a); //output is NaN
Copy

You can try this but it will fail too.

1Math.max.call(Math, a); // output is NaN
Copy

This will work

1Math.max.apply(Math, a); //output is 3
Copy

apply method works because it accepts an array as the argument. call method passes the individual params to the called method directly and hence it does not work. You can read more about JavaScript apply and call methods here .