JavaScript Interview Questions and Answers

         I have shared some JavaScript interview questions and answers, please prepare before going for interview.

1) What is JavaScript ?

The JavaScript is a scripting language and it's used for client side web development. 

2) Is JavaScript case sensitive ? 

Yes, it is a case sensitive.

3) What are the data types used in JavaScript ?

JavaScript data types are ,

• String
• Number
•  Boolean
•  Function
• Object
•  Null
•  Undefined.

4) What are the loops available in JavaScript?

 The following are the loops in JavaScript,

• for
• while
• do-while

5) What are the ways of making comments in JavaScript ?

     There are two ways, single line and block comments.

Single line comment
// - single line comment

Block comment
/*   block comments
*/

6) What are all the types of pop up boxes available in JavaScript ?

There are three pop up boxes,

1. Alert
2. Confirm
3. Prompt 

 

 7) What does isNaN function do ?

 It returns True if the argument is not a number.

Examples,

document.write(isNaN("Hello123")+ "<br>");
document.write(isNaN("2013/06/23")+ "<br>");
document.write(isNaN(123)+ "<br>");

Output would be,

true
true
false

8) What is the difference between undefined and undeclared variable ?
          
         The variable which is not declared in a code, is called undeclared variable and a variable which is declared but not assigned any value is called undefined variable.

Ex:- undefined variable

<script>
   var p;
   alert(p); // This will give error because p is undefined variable.
</script>

Ex:- undeclared variable

<script>
   alert(p); // This will give error because p is undeclared variable.
</script>

 9) What is the data types of variables in JavaScript ?

All variables in JavaScript are of Object data type.

 

10) What is object in JavaScript ? and  How to create the object in JavaScript ?

      JavaScript object is an entity having state and behavior.  JavaScript is an object based language and it treats everything is an object.

    There are three ways to create an object,

1) Object Literal

Syntax:--

object = {property1 : value1, property2 : value2, ......}

the property and value are separated by ':'.

Example:-

<script> 

std={id:1114, name:"Ram Bajaj", subject:"Physics"} 

document.write(std.id+" "+std.name+" "+std.subject); 

</script>

2) Using New Keyword

Syntax:--

var object = new Object();

  

Example:--

<script> 

    var std=new Object(); 

    std.id=10; 

    std.name="Mahesh"; 

    std.subject="Maths"; 

    document.write(std.id+" "+std.name+" "+std.subject); 

</script>

3) Using an Object Constructor
  
    In this case, we can create the function with arguments. The value of each of these arguments can be assigned  to the current object by using this keyword.
Example :--

<script> 

function std(id,name,subject){ 

this.id=id; 

this.name=name; 

this.subject=subject; 

} 

s=new std(10,"Komal","Physics"); 

document.write(s.id+" "+s.name+" "+s.subject); 

</script>

11) What is the use of this keyword in JavaScript ?

            The this keyword behaves differently in JavaScript compared to other language. In Object Oriented languages, the this keyword refers to the current instance of the class. In JavaScript the value of this is determined mostly by the invocation context of function (context.function()) and where it is called

 

12) What is difference between '==' and '===' ?

       These are the operators provided by JavaScript – strict equality and Type converting equality.

Strict equality (===) returns true if the values which it is going to compare have the same data type. 
Taking an example, “2” will not be equal to 2  i.e. (“2″===2) will return false.

Secondly, Type converting equality (==), automatically converts the variable to value irrespective of the data type. Taking an example, here “2” will be equal to 2  i.e. (“2″===2) will return true.

Summarizing it, double equal (==) is an autotype converting equality operator while three equals (===) is a strict equality operator, i.e. it will not convert values automatically.

 

Other Examples :-- 

0==false   // true, because false is equivalent of 0
0===false  // false, because both operands are of different type
2=="2"     // true, auto type coercion, string converted into number
2==="2"    // false, since both operands are not of same type

13) What are the different objects used in  JavaScript?

    The following are the objects used in JavaScript that shows the relationship of one object to another.

1)  Window Object  

       It's the topmost object in the hierarchy . It refers to the content area of the browser window that consists of HTML documents. Each frame is also a window that has some actions inside it.

2) Document Object 

    

     The Document object represents the  HTML documents that window will display.  It has various properties that refer to other objects, which allow access to and modification of content in the document.

3) Form Object  

     

      A form object is used to take user data as input for processing. It corresponds to an HTML input form constructed with the <form> ..</form> tag.

  

14) What is encodeURI() function ? 

           The encodeURI() function is used to encode a URI. This function encodes all special characters, except these < , / ? : @ & = + $ #>.

Example,

 

var uri="http://www.techbeamers.com/how to make a website using javaScript";

var encodedURI = encodeURI(uri);

console.log(encodedURI);

  

Output:--

http://www.somedomain.com/how%20to%20make%20a%20website%20using%20javaScript

        We see that JavaScript encodes the space between the words in the <uri> variable as <%20>. Thus, the encodeURI function is used to encode special reserved characters and other non-ASCII characters in the URI.

 15) What is Closure in JavaScript ?

         Basically Closure is a local variable, which will be executed after the specific function has returned. A Closure provides us a free environment, where the outer function can easily access the inner functions and inner variables without any scope restrictions. 

Example:-  

function create() {
   var counter = 0;
   return {
      increment: function() {
         counter++;
      },
  
      print: function() {
         console.log(counter);
      }
   }
}
var c = create();
c.increment();
c.print();     // ==> 1

16) How to determine the state of a checkbox using JavaScript? 

var checked = window.document.getElementById("myCheckBox").checked;

alert(checked); // will give true or false

 17) How can the style/class of an element be changed?

It can be done in the as follows,

document.getElementById("myText").style.className = "div1"; 

18) What would be the output of below code?  

(function(){
  var a = b = 3;
})();

console.log("a defined? " + (typeof a !== 'undefined'));
console.log("b defined? " + (typeof b !== 'undefined'));

Output :-- a defined? false

          b defined? true

19) What would be the output of below code?  

for (var i = 0; i < 5; i++) {
 setTimeout(function() { console.log(i); }, i * 1000 );
}

Output :-- 5 5 5 5 5

20) What would be the output of below code?  

for (var i = 0; i < 5; i++) {
    (function(x) {
        setTimeout(function() { console.log(x); }, x * 1000 );
    })(i);
}

Output : -- 0 1 2 3 4