Saturday 30 May 2015

Frontend Interview Questions and Answers for experienced

Front end 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) { = name;

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

2. Class Literal notation
var person = {  
    name: "",
    setName: function(name) { = name;
person.setName("Web Technology experts Notes");; // Web Technology experts Notes

3. Singleton through a function
var person = new function() {  
    this.setName = function(name) { = name;
    this.printData = function() {
console.log(person.printData()); // Web Technology experts Notes

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

Question: How can you add a method to a already defined class?
using prototype you can achieve the same.
function Person(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?
  • Background
  • Text
  • Font
  • List
  • Outline
  • Margin
  • Border
  • Padding
  • Table

Question: What are some of the new features and properties in CSS3? Box model
  • New Web fonts
  • Rounded corners
  • Box Shadows, 
  • Transform property
  • Border Images
  • Text Shadows
  • New Color schemes
  • Multi-column layout
  • New Pseudo-classes
  • New Gradients