Hexaware Technologies JavaScript Most Frequently Asked Latest Interview Questions Answers
What is an ECMAScript?
ECMAScript (European Computer Manufacturers Association) Script is a specification for the scripting language standards. It has standardized Javascript which made Javascript the best implementation of ECMAScript.
Are Attributes and Property the same?
No. Attributes are something that can give more details on an element like id, type, value etc. Whereas, Property is the value assigned to the property like type="text", value='Name' etc.
List out the different ways an HTML element can be accessed in a Javascript code.
Here are the list of ways an HTML element can be accessed in a Javascript code,
(i) getElementById('idname'): Gets an element by its ID name
(ii) getElementsByClass('classname'): Gets all the elements that have the given classname.
(iii) getElementsByTagName('tagname'): Gets all the elements that have the given tag name.
(iv) querySelector(): This function takes css style selector (like #id/.classname/tagname) and returns the first selected element.
(v) querySelectorAll(): Similar to querySelector, this function returns a NodeList of html elements.
In how many ways a Javascript code can be involved in an HTML file?
The Javascript code can be involved in 3 ways (i) Inline (ii) Internal (iii) External
What are the new ways to define a variable in Javascript?
There are three possible ways of defining a variable in Javascript (i) var (which is used from the beginning) (ii) const (iii) let. The last two ways are the latest ways of defining a variable and are introduced in ES-2015(ES6 version).
What is a Typed Language?
Typed Language is in which the values are associated with values and not with variables. It is of two types:
Dynamically: in this, the variable can hold multiple types; like in JS a variable can take number, chars.
Statically: in this, the variable can hold only one type, like in Java a variable declared of string can take only set of characters and nothing else.
NOTE: Typescript is a superset of JS which is of typed language.
What does a typeof operator do?
The operator typeof gives the type of a variable/data available in it. The typeof operator can be used on Reference data types also.
Name some of the ways in which Type Conversion is possible.
Type Conversion is to convert from one data type to another data type.
(i) Number to String Conversion.
toString: Other data type to String.
val = (5).toString(); converts integer to string.
val = (true).toString(); converts boolean to string.
Convert from Number/Boolean/Date to String.
Number to String: String(9) converts num to string
Boolean to String: String(true) converts bool to str
Date to String: String(new Date()) date to string
Array to String: String([2,2,2]) Array to string.
(ii) String to Number Conversion.
parseInt: String to Int only (no decimals)
val = parseInt('11'); outputs 100 as number
val = parseFloat('22.22') outputs 22.22 as float
Convert from String/Boolean to Number/Date.
String to Number: Number('9') converts str - num
(9).toFixed(4) gives 9.0000 as the output
Boolean to Number: Number(true) converts to no.
Null to Number: Number(null) converts to no. (0)
Chars to Number: Number('ss') give NaN.
What is a “closure” in JavaScript? Provide an example.
A closure is an inner function that has access to the variables in the outer (enclosing) function’s scope chain. The closure has access to variables in three scopes; specifically: (1) variable in its own scope, (2) variables in the enclosing function’s scope, and (3) global variables.
Here is an example:
var globalVar = "xyz";
(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);
In the above example, variables from innerFunc, outerFunc, and the global namespace are all in scope in the innerFunc. The above code will therefore produce the following output:
outerArg = 123
innerArg = 456
outerVar = a
innerVar = b
globalVar = xyz
What will be the output of the following code:
for (var i = 0; i < 5; i++) {
setTimeout(function() { console.log(i); }, i * 1000 );
}
Explain your answer. How could the use of closures help here?
The code sample shown will not display the values 0, 1, 2, 3, and 4 as might be expected; rather, it will display 5, 5, 5, 5, and 5.
The reason for this is that each function executed within the loop will be executed after the entire loop has completed and all will therefore reference the last value stored in i, which was 5.
Closures can be used to prevent this problem by creating a unique scope for each iteration, storing each unique value of the variable within its scope, as follows:
for (var i = 0; i < 5; i++) {
(function(x) {
setTimeout(function() { console.log(x); }, x * 1000 );
})(i);
}
This will produce the presumably desired result of logging 0, 1, 2, 3, and 4 to the console.
In an ES2015 context, you can simply use let instead of var in the original code:
for (let i = 0; i < 5; i++) {
setTimeout(function() { console.log(i); }, i * 1000 );
What would the following lines of code output to the console?
console.log("0 || 1 = "+(0 || 1));
console.log("1 || 2 = "+(1 || 2));
console.log("0 && 1 = "+(0 && 1));
console.log("1 && 2 = "+(1 && 2));
Explain your answer.
The code will output the following four lines:
0 || 1 = 1
1 || 2 = 1
0 && 1 = 0
1 && 2 = 2
In JavaScript, both || and && are logical operators that return the first fully-determined “logical value” when evaluated from left to right.
The or (||) operator. In an expression of the form X||Y, X is first evaluated and interpreted as a boolean value. If this boolean value is true, then true (1) is returned and Y is not evaluated, since the “or” condition has already been satisfied. If this boolean value is “false”, though, we still don’t know if X||Y is true or false until we evaluate Y, and interpret it as a boolean value as well.
Accordingly, 0 || 1 evaluates to true (1), as does 1 || 2.
The and (&&) operator. In an expression of the form X&&Y, X is first evaluated and interpreted as a boolean value. If this boolean value is false, then false (0) is returned and Y is not evaluated, since the “and” condition has already failed. If this boolean value is “true”, though, we still don’t know if X&&Y is true or false until we evaluate Y, and interpret it as a boolean value as well.
However, the interesting thing with the && operator is that when an expression is evaluated as “true”, then the expression itself is returned. This is fine, since it counts as “true” in logical expressions, but also can be used to return that value when you care to do so. This explains why, somewhat surprisingly, 1 && 2 returns 2 (whereas you might it expect it to return true or 1).
What is an ECMAScript?
ECMAScript (European Computer Manufacturers Association) Script is a specification for the scripting language standards. It has standardized Javascript which made Javascript the best implementation of ECMAScript.
Are Attributes and Property the same?
No. Attributes are something that can give more details on an element like id, type, value etc. Whereas, Property is the value assigned to the property like type="text", value='Name' etc.
List out the different ways an HTML element can be accessed in a Javascript code.
Here are the list of ways an HTML element can be accessed in a Javascript code,
(i) getElementById('idname'): Gets an element by its ID name
(ii) getElementsByClass('classname'): Gets all the elements that have the given classname.
(iii) getElementsByTagName('tagname'): Gets all the elements that have the given tag name.
(iv) querySelector(): This function takes css style selector (like #id/.classname/tagname) and returns the first selected element.
(v) querySelectorAll(): Similar to querySelector, this function returns a NodeList of html elements.
 |
| Hexaware Technologies JavaScript Most Frequently Asked Latest Interview Questions Answers |
In how many ways a Javascript code can be involved in an HTML file?
The Javascript code can be involved in 3 ways (i) Inline (ii) Internal (iii) External
What are the new ways to define a variable in Javascript?
There are three possible ways of defining a variable in Javascript (i) var (which is used from the beginning) (ii) const (iii) let. The last two ways are the latest ways of defining a variable and are introduced in ES-2015(ES6 version).
What is a Typed Language?
Typed Language is in which the values are associated with values and not with variables. It is of two types:
Dynamically: in this, the variable can hold multiple types; like in JS a variable can take number, chars.
Statically: in this, the variable can hold only one type, like in Java a variable declared of string can take only set of characters and nothing else.
NOTE: Typescript is a superset of JS which is of typed language.
What does a typeof operator do?
The operator typeof gives the type of a variable/data available in it. The typeof operator can be used on Reference data types also.
Name some of the ways in which Type Conversion is possible.
Type Conversion is to convert from one data type to another data type.
(i) Number to String Conversion.
toString: Other data type to String.
val = (5).toString(); converts integer to string.
val = (true).toString(); converts boolean to string.
Convert from Number/Boolean/Date to String.
Number to String: String(9) converts num to string
Boolean to String: String(true) converts bool to str
Date to String: String(new Date()) date to string
Array to String: String([2,2,2]) Array to string.
(ii) String to Number Conversion.
parseInt: String to Int only (no decimals)
val = parseInt('11'); outputs 100 as number
val = parseFloat('22.22') outputs 22.22 as float
Convert from String/Boolean to Number/Date.
String to Number: Number('9') converts str - num
(9).toFixed(4) gives 9.0000 as the output
Boolean to Number: Number(true) converts to no.
Null to Number: Number(null) converts to no. (0)
Chars to Number: Number('ss') give NaN.
What is a “closure” in JavaScript? Provide an example.
A closure is an inner function that has access to the variables in the outer (enclosing) function’s scope chain. The closure has access to variables in three scopes; specifically: (1) variable in its own scope, (2) variables in the enclosing function’s scope, and (3) global variables.
Here is an example:
var globalVar = "xyz";
(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);
In the above example, variables from innerFunc, outerFunc, and the global namespace are all in scope in the innerFunc. The above code will therefore produce the following output:
outerArg = 123
innerArg = 456
outerVar = a
innerVar = b
globalVar = xyz
What will be the output of the following code:
for (var i = 0; i < 5; i++) {
setTimeout(function() { console.log(i); }, i * 1000 );
}
Explain your answer. How could the use of closures help here?
The code sample shown will not display the values 0, 1, 2, 3, and 4 as might be expected; rather, it will display 5, 5, 5, 5, and 5.
The reason for this is that each function executed within the loop will be executed after the entire loop has completed and all will therefore reference the last value stored in i, which was 5.
Closures can be used to prevent this problem by creating a unique scope for each iteration, storing each unique value of the variable within its scope, as follows:
for (var i = 0; i < 5; i++) {
(function(x) {
setTimeout(function() { console.log(x); }, x * 1000 );
})(i);
}
This will produce the presumably desired result of logging 0, 1, 2, 3, and 4 to the console.
In an ES2015 context, you can simply use let instead of var in the original code:
for (let i = 0; i < 5; i++) {
setTimeout(function() { console.log(i); }, i * 1000 );
What would the following lines of code output to the console?
console.log("0 || 1 = "+(0 || 1));
console.log("1 || 2 = "+(1 || 2));
console.log("0 && 1 = "+(0 && 1));
console.log("1 && 2 = "+(1 && 2));
Explain your answer.
The code will output the following four lines:
0 || 1 = 1
1 || 2 = 1
0 && 1 = 0
1 && 2 = 2
In JavaScript, both || and && are logical operators that return the first fully-determined “logical value” when evaluated from left to right.
The or (||) operator. In an expression of the form X||Y, X is first evaluated and interpreted as a boolean value. If this boolean value is true, then true (1) is returned and Y is not evaluated, since the “or” condition has already been satisfied. If this boolean value is “false”, though, we still don’t know if X||Y is true or false until we evaluate Y, and interpret it as a boolean value as well.
Accordingly, 0 || 1 evaluates to true (1), as does 1 || 2.
The and (&&) operator. In an expression of the form X&&Y, X is first evaluated and interpreted as a boolean value. If this boolean value is false, then false (0) is returned and Y is not evaluated, since the “and” condition has already failed. If this boolean value is “true”, though, we still don’t know if X&&Y is true or false until we evaluate Y, and interpret it as a boolean value as well.
However, the interesting thing with the && operator is that when an expression is evaluated as “true”, then the expression itself is returned. This is fine, since it counts as “true” in logical expressions, but also can be used to return that value when you care to do so. This explains why, somewhat surprisingly, 1 && 2 returns 2 (whereas you might it expect it to return true or 1).
Which request is better, Get or Post?
AJAX requests should use an HTTP GET request where the data does not change for a given URL requested.
An HTTP POST should be used when state is updated on the server. This is highly recommended for a consistent web application architecture.
What are the limitations of Ajax?
An Ajax Web Application tends to confuse end users if the network bandwidth is slow and there is no full postback running.
What is AJAX Framework?
ASP.NET AJAX is a free framework to implement Ajax in asp.net web applications. It is used to quickly creating efficient and interactive Web applications that work across all browsers.
How can we cancel the XMLHttpRequest in AJAX?
Abort() method can be called to cancel the XMLHttpRequest in Ajax.
Is AJAX code cross browser compatible?
No, it is supporting cross browser compatible. If the browsers supports native XMLHttpRequest JavaScript object, then this can be used.
What is the name of object used for AJAX request?
XmlHttpRequest object is used for Ajax requests.
What is prerequisite for Update Panel in Ajax?
Script Manager is pre-requisite to use Update Panel controls.
How many update panel can be used per page?
There are no restrictions on the number of update panels per page.
How can you find out that an AJAX request has been completed?
ReadyState property is used to check whether AJAX request has been completed. If the property is equal to four, then the request has been completed and data is available.
Is javascript knowledge is required to do Ajax?
Yes, if you plan to develop new AJAX functionality for your web application.
What are all the browsers support AJAX?
Following browsers support AJAX:
Internet Explorer 5.0 and above
Opera 7.6 and above
Netscape 7.1 and above
Safari 1.2 and above.
AJAX requests should use an HTTP GET request where the data does not change for a given URL requested.
An HTTP POST should be used when state is updated on the server. This is highly recommended for a consistent web application architecture.
What are the limitations of Ajax?
An Ajax Web Application tends to confuse end users if the network bandwidth is slow and there is no full postback running.
What is AJAX Framework?
ASP.NET AJAX is a free framework to implement Ajax in asp.net web applications. It is used to quickly creating efficient and interactive Web applications that work across all browsers.
How can we cancel the XMLHttpRequest in AJAX?
Abort() method can be called to cancel the XMLHttpRequest in Ajax.
Is AJAX code cross browser compatible?
No, it is supporting cross browser compatible. If the browsers supports native XMLHttpRequest JavaScript object, then this can be used.
What is the name of object used for AJAX request?
XmlHttpRequest object is used for Ajax requests.
What is prerequisite for Update Panel in Ajax?
Script Manager is pre-requisite to use Update Panel controls.
How many update panel can be used per page?
There are no restrictions on the number of update panels per page.
How can you find out that an AJAX request has been completed?
ReadyState property is used to check whether AJAX request has been completed. If the property is equal to four, then the request has been completed and data is available.
Is javascript knowledge is required to do Ajax?
Yes, if you plan to develop new AJAX functionality for your web application.
What are all the browsers support AJAX?
Following browsers support AJAX:
Internet Explorer 5.0 and above
Opera 7.6 and above
Netscape 7.1 and above
Safari 1.2 and above.