Frontend Interview Questions and Answers for experienced

Question: How can you declare a class in Javascript?
In javascript, classes declare is quite different from C++, PHP and java.
Following are three different ways to declare the javascript.
1. Class using function as a constructor

function Person(name) {  
    this.name = name;
}

/* Create an Object an object */
var person = new Person("Web Technology experts Notes");  
person.name; // Web Technology experts Notes

2. Class Literal notation

var person = {  
    name: "",
    setName: function(name) {
        this.name = name;
    }
}
person.setName("Web Technology experts Notes");  
person.name; // Web Technology experts Notes

3. Singleton through a function

var person = new function() {  
    this.setName = function(name) {
        this.name = name;
    }
    this.printData = function() {
        return this.name;
    }
}
person.setName("Rafael");  
console.log(person.printData()); // Web Technology experts Notes

Question: What is Difference between null and undefined?
NULL is object
undefined is a datatype

console.log(null);  
console.log(undefined);

Question: How can you add a method to a already defined class?
using prototype you can achieve the same.

function Person(name) {  
    this.name = name;
}
Person.prototype.newfunction = function() {  
    console.debug("new function is called.");
}

//create an object
var person = new Person("Web Technology");
// Calling the new method  
person.newfunction(); // new function is called.

Question: What is Sass?
Sass is the modern way of doing CSS.
Sass works with variables, nested syntax and mathematical operations

Question: How to improve the performance of page from Frontend?

Use sprite images
Javascripts should be at the bottom of the page
Ensure parallel requests
Compress images
Browser Caching

Question: What is XHTML?
XHTML is an HTML that follows the XML rules.

Question: Why Recommended external CSS or Javascript versus inline?
1. Hard to maintain the Inline JS/CSS.
2. Inline js/css load slower.
3. No caching benefits in Inline JS/CSS.

Question: Why do we need to use W3C standard code?
W3C standards are to ensure cross-platform compatibility and more compact file sizes.

Question: What is lazy loading?
Lazy loading is a design pattern commonly used in computer field.
Lazy loading is loading code only once user needs it.

Question: What is the difference between HTML elements and tags?
HTML elements communicate to the browser how to render text.
Aftr that they are surrounded by angular brackets <> they form HTML tags.

Question: What does DOCTYPE mean?
DOCTYPE tells the browser which type of HTML is used in current webpage.

Question: Tell the name of few new tags in HTML5?
datalist, datetime, output, keygen, date, month, week, time, number, range, email, and url.

Question: What is the purpose of the z-index and how is it used?
The z-index helps specify the positioned elements that may overlap one another.
z-index can take following values.
Auto: Sets the order equal to its parents.
Number: Set Orders the Number specified.
Initial: Sets this property to its default value which is zero.
Inherit: Inherits from parent element.

Question: List the main CSS style sheet properties?