Top 5 JavaScript interview questions
As javascript is growing every day. Its one of the popular programming language in 2018 and there are a lot of opportunities for Javascript developer. If you attending an interview for a mid-level web developer, here are the questions you mostly encountered with. Understanding about the below concepts is very much imported to crack the interview rounds.
1. What is the difference between classical inheritance and prototypal inheritance?
Classical inheritance
- Instances inherit from a class and create a sub-class relationship and hierarchical structure.
- Instances are typically instantiated via constructor function with a new keyword.
- Classical inheritance may or may not use ‘class’ keyword from ES6.
Example
//VotersList function expression
const votersList = function(name, age){
this.name = name;
this.age = age;
}
// Create new instances of voters list
let john = new votersList("John", 32),
let joe = new votersList("Joe", 30);
//Overwrite the existing object property
john.age = 99;
Prototypal inheritance
- instances directly inherited from other objects.
- Instances are inherited via factory functions or Object.create() method.
- Instances may be composed of many different objects, allowing for easy selective inheritance.
Example
//Voter details object
var voterdetails = {
voted: true,
Name: function(name){
this.name = name
},
Age: function(age){
this.age = age;
}
}
// Create new instances of voter details
var joe = Object.create(voterdetails),
var john = Object.create(voterdetails);
joe.Name("Joe");
joe.Age(22);
john.Name("John");
john.Age(30);
// Or just one method
voterlist.create = function(name, age){
this.name = name;
this.age = age;
}
john.create("john", 100);
joe.create("joe", 30);
2. what is a closure ?
A closure is an inner function which has access to the outer function’s variables. The closure has three scope chains. It has access to its own scope which means the variable declared in the inner function block. It has access to the outer function variables and it has access to the global variables
//closure
var globalVar = "abc";
(function outerFunc(outerArg)
{
var outerVar = 'a';
(function innerFunc(innerArg)
{
var innerVar = 'b';
console.log(
"outerArg = " + outerArg + "\n" +
"innerArg = " + innerArg + "\n" +
"outerVar = " + outerVar + "\n" +
"innerVar = " + innerVar + "\n" +
"globalVar = " + globalVar);
})(456);
})(123);
//output of the above code
outerArg = 123
innerArg = 456
outerVar = a
innerVar = b
globalVar = abc
The inner function is able to access the inner function variable, the outer function variable, and the global variable
3. What is javascript hoisting?
Please refer the link to understand it.
4. Describe NaN.
The ‘NaN’ represents a value that is ‘not a number’. The value returns when the mathematical operation could not be performed due to either one the operands were non-numeric and the result of the operation will be non-numeric.
Example, 123/’a’ which returns NaN. Where a is a non-numeric operand.For one thing, although
NaN means “not a number”, its type is, believe it or not, Number:
console.log(typeof NaN === "number"); // logs "true" type of NaN is number
Additionally, NaN compared to anything – even itself! – is false:
console.log(NaN === NaN); // logs "false"
A simple way to test whether a number is equal to NaN using ES6 build in function Number.isNaN()
Number.isNaN('abc'/1)
//true
Number.isNaN(100/2)
//false
5.what is the difference between call, apply and bind in javascript?
Call, apply and bind is a method which allows you to borrow the functionalities from other objects. And all are used to call the functions by passing different objects and provides results and the other way you can use the same method on different objects by using call, apply and bind Look at the below examples you can see the difference between them.
Call()
//object
const obj = {num:3};
//function expression to multiply the numbers
const multiply = function(a,b){
return this.num*a*b;
}
//invoking the method by using call method
multiply.call(obj,3,2); // 18
as you can see from the above code the method multiply cannot access the num. To enable the access of an object in multiply function we are using call method by passing the object and function parameter to get the multiplication of numbers.
Apply()
apply used to pass the function parameter as a array of arguemtns. See the example below to know about more.
// object
const obj = {num:3};
//array values
const arr = [3,2,1];
//Additon of 3 numbers
const addNum = function(a,b,c)
{
return this.num+a+b+c;
}
//invoking the function using apply method
addNum.apply(obj,arr) // 9
Bind()
Use .bind() when you want that function to later be called with a certain context, useful in events.
instead of return the value which returns the funtion. Which can called separtely by passing the function areguments.
See the example below to understand about it.
//object
const obj = {num:5};
//addtion of three numbers
const addNum = function(a,b,c)
{
return this.num+a+b+c;
}
var bound = addNum.bind(obj); //allows us to easily set which specific object will be bound to this.
Bound(3,2,1); //11
We use the Bind () method primarily to call a function with the this value set explicitly. It other words, bind () allows us to easily set which specific object will be bound to this when a function or method is invoked.