FULL STACK WEB DEVELOPMENT INTERVIEW QUESTIONS

Who is a Full-Stack Developer?

A full-stack web developer is a person who can develop both client and server software. Simply put, full-stack developers comprehend all the technologies that go into making a website. The responsibilities of Front-end Developers include developing and designing front-end (client-side) web architecture, and server-side (back-end) applications, working alongside graphic designers to create web design elements, developing APIs and RESTful services, testing, and debugging software, ensuring cross-platform compatibility and optimization, etc. In addition to mastering HTML and CSS, he/she also knows how to:

Program a browser (like using JavaScript, jQuery, Angular, or Vue)
Program a server (like using PHP, ASP, Python, or Node)
Program a database (like using SQL, SQLite, or MongoDB)

Now let’s look at the most common Full Stack Developer interview questions for both freshers and experienced candidates.

Full Stack Developer Interview Questions for Freshers

1. To develop a project from scratch, what technologies and languages would you need, or what skills a full-stack developer should have?

A full-stack developer must be familiar with the following:

Programming Languages: Full-stack developers should be competent in more than one programming language, such as Java, Python, PHP, Ruby, C++, etc.
Front End technologies: You should be familiar with front-end technologies such as HTML5, CSS3, JavaScript, etc. Knowledge of third-party libraries such as jQuery, Ajax, Angular, ReactJS, etc., is also important.
Frameworks: This requires proficiency in a variety of development frameworks, including Spring, Spring Boot, Django, MyBatis, PHP, Hibernate, and others.
Databases and caches: As a full-stack developer, you should also know about various DBMS (Database Management Systems) technologies like MySQL, SQLite, Oracle, and MongoDB. It is helpful to have a basic understanding of caching mechanisms like redis, memcached, and varnish.
Design Ability: Having a good understanding of design is also important if you wish to become a successful Full-Stack web developer. Moreover, the person should be aware of the principles of prototyping and UX/UI design.
Server: Experience with Apache or NGINX would be beneficial. Good knowledge of Linux helps enormously when administering servers.

Frequently Asked on HTML!

1. Are the HTML tags and elements the same thing?

No. HTML elements are defined by a starting tag and may contain some content and a closing tag. For example, <h1>Heading 1</h1> is an HTML element but just <h1> is a starting tag and </h1> is a closing tag.

2. What are tags and attributes in HTML?

Tags are the primary component of the HTML that defines how the content will be structured/ formatted, whereas Attributes are used along with the HTML tags to define the characteristics of the element. For example, <p align=” center”>Interview questions</p>, in this the ‘align’ is the attribute using which we will align the paragraph to show in the center of the view.

3. What are void elements in HTML?

HTML elements that do not have closing tags or do not need to be closed are Void elements. For Example <br />, <img />, <hr />, etc.

4. What is the advantage of collapsing white space?

In HTML, a blank sequence of whitespace characters is treated as a single space character, Because the browser collapses multiple spaces into a single space character and this helps a developer to indent lines of text without worrying about multiple spaces and maintain readability and understandability of HTML codes.

5. What are HTML Entities?

In HTML some characters are reserved like ‘<’, ‘>’, ‘/’, etc. To use these characters in our webpage we need to use the character entities called HTML Entities. Below are a few mapping between the reserved character and its respective entity character to be used.

6. What is the ‘class’ attribute in HTML?

The class attribute is used to specify the class name for an HTML element. Multiple elements in HTML can have the same class value. Also, it is mainly used to associate the styles written in the stylesheet with the HTML elements.

7. What type of audio files can be played using HTML5?

HTML5 supports the following three types of audio file formats:

8. What is the difference between the ‘id’ attribute and the ‘class’ attribute of HTML elements?

Multiple elements in HTML can have the same class value, whereas a value of id attribute of one element cannot be associated with another HTML element.

9. In how many ways can we position an HTML element? Or what are the permissible values of the position attribute?

There are mainly 7 values of position attribute that can be used to position an HTML element:

static: Default value. Here the element is positioned according to the normal flow of the document.
absolute: Here the element is positioned relative to its parent element. The final position is determined by the values of left, right, top, bottom.
fixed: This is similar to absolute except here the elements are positioned relative to the <html> element.
relative: Here the element is positioned according to the normal flow of the document and positioned relative to its original/ normal position.
initial: This resets the property to its default value.
inherit: Here the element inherits or takes the property of its parent.

10. Describe the HTML layout structure.

Every web page has different components to display the intended content and a specific UI. But still, there are a few things that are templated and are globally accepted ways to structure the web page, such as:

<header>: Stores the starting information about the web page.
<footer>: Represents the last section of the page.
<nav>: The navigation menu of the HTML page.
<article>: It is a set of information.
<section>: It is used inside the article block to define the basic structure of a page.
<aside>: Sidebar content of the page.

11. How to optimize website assets loading?

To optimize website load time we need to optimize its asset loading and for that:

CDN hosting – A CDN or content delivery network is geographically distributed servers to help reduce latency.
File compression – This is a method that helps to reduce the size of an asset to reduce the data transfer
File concatenation – This reduces the number of HTTP calls
Minify scripts – This reduces the overall file size of JS and CSS files
Parallel downloads – Hosting assets in multiple subdomains can help bypass the download limit of 6 assets per domain of all modern browsers. This can be configured but most general users never modify these settings.
Lazy Loading – Instead of loading all the assets at once, the non-critical assets can be loaded on a need basis.

12. What are the various formatting tags in HTML?

HTML has various formatting tags:

<b> – makes text bold
<i> – makes text italic
<em> – makes text italic but with added semantics importance
<big> – increases the font size of the text by one unit
<small> – decreases the font size of the text by one unit
<sub> – makes the text a subscript
<sup> – makes the text a superscript
<del> – displays as strike-out text
<strong> – marks the text as important
<mark> – highlights the text
<ins> – displays as added text

13. What are the different kinds of Doctypes available?

The three kinds of Doctypes which are available:

Strict Doctype
Transitional Doctype
Frameset Doctype

14. Please explain how to indicate the character set being used by a document in HTML.

The character set is defined in <meta> tag inside <head> element.

<!DOCTYPE html>
<html>
 <head>
   <meta charset="UTF-8">
   ...
   ...
 </head>
 ...
</html>

15. What is the difference between <strong>, <b> tags and <em>, <i> tags?

The effect on a normal webpage of the tags <strong>, <b> and <em>, <i> is the same. <b> and <i> tags stand for bold and italic. These two tags only apply font styling and bold tag <b>, which just adds more ink to the text, these tags don’t say anything about the text.

Whereas, <strong> and <em> tags represent that the span of text is of strong importance or more importance and emphatic stress respectively than the rest of the text. These tags have semantic meaning.

16. What is the significance of <head> and <body> tag in HTML?

<head> tag provides the information about the document. It should always be enclosed in the <html> tag. This tag contains the metadata about the webpage and the tags that are enclosed by head tags like <link>, <meta>, <style>, <script>, etc. are not displayed on the web page. Also, there can be only 1 <head> tag in the entire HTML document, and will always be before the <body> tag.

<body> tag defines the body of the HTML document. It should always be enclosed in the <html> tag. All the contents that need to be displayed on the web page like images, text, audio, video, and contents, using elements like <p>, <img>, <audio>, <heading>, <video>, <div>, etc. will always be enclosed by the <body> tag. Also, there can be only 1 body element in an HTML document, and will always be after the <head> tag.

17. Can we display a web page inside a web page or Is nesting of webpages possible?

Yes, we can display a web page inside another HTML web page. HTML provides a tag <iframe> using which we can achieve this functionality.

<iframe src=”url of the web page to embed” />

18. How is Cell Padding different from Cell Spacing?

Cell Spacing is the space or gap between two consecutive cells. Whereas, Cell Padding is the space or gap between the text/ content of the cell and the edge/ border of the cell. Please refer to the above figure example to find the difference.

19. How can we club two or more rows or columns into a single row or column in an HTML table?

HTML provides two table attributes “rowspan” and “colspan” to make a cell span multiple rows and columns respectively.

20. Is it possible to change an inline element into a block-level element?

Yes, it is possible to use the “display” property with its value as “block”, to change the inline element into a block-level element.

Frequently Asked on CSS!

1. What is the Box model in CSS? Which CSS properties are a part of it?

A rectangle box is wrapped around every HTML element. The box model is used to determine the height and width of the rectangular box. The CSS Box consists of Width and height (or in the absence of that, default values and the content inside), padding, borders, margin.

Content: Actual Content of the box where the text or image is placed.
Padding: Area surrounding the content (Space between the border and content).
Border: Area surrounding the padding.
Margin: Area surrounding the border.

2. What are the advantages of using CSS?

The main advantages of CSS are given below:

Separation of content from presentation – CSS provides a way to present the same content in multiple presentation formats in mobile or desktop or laptop.
Easy to maintain – CSS, built effectively can be used to change the look and feel complete by making small changes. To make a global change, simply change the style, and all elements in all the web pages will be updated automatically.
Bandwidth – Used effectively, the style sheets will be stored in the browser cache and they can be used on multiple pages, without having to download again.

3. What are the limitations of CSS?

Disadvantages of CSS are given below:

Browser Compatibility: Some style selectors are supported and some are not. We have to determine which style is supported or not using the @support selector).
Cross Browser issue: Some selectors behave differently in a different browser).
There is no parent selector: Currently, Using CSS, you can’t select a parent tag.

You can download a PDF version of Css Interview Questions.

Download PDF

4. How to include CSS in the webpage?

There are different ways to include a CSS in a webpage,

1 – External Style Sheet: An external file linked to your HTML document: Using link tag, we can link the style sheet to the HTML page.

<link rel="stylesheet" type="text/css" href="mystyles.css" />

2 – Embed CSS with a style tag: A set of CSS styles included within your HTML page.

<style type="text/css">

/*Add style rules here*/

</style>

Add your CSS rules between the opening and closing style tags and write your CSS exactly the same way as you do in stand-alone stylesheet files.

3 – Add inline styles to HTML elements(CSS rules applied directly within an HTML tag.): Style can be added directly to the HTML element using a style tag.

<h2 style="color:red;background:black">Inline Style</h2>

4 – Import a stylesheet file (An external file imported into another CSS file): Another way to add CSS is by using the @import rule. This is to add a new CSS file within CSS itself.

@import "path/to/style.css";

5. What are the different types of Selectors in CSS?

A CSS selector is the part of a CSS ruleset that actually selects the content you want to style. Different types of selectors are listed below.

Universal Selector: The universal selector works like a wildcard character, selecting all elements on a page. In the given example, the provided styles will get applied to all the elements on the page.

* {
  color: "green";
  font-size: 20px;
  line-height: 25px;
}

Element Type Selector: This selector matches one or more HTML elements of the same name. In the given example, the provided styles will get applied to all the ul elements on the page.

ul {
  line-style: none;
  border: solid 1px #ccc;
}

ID Selector: This selector matches any HTML element that has an ID attribute with the same value as that of the selector. In the given example, the provided styles will get applied to all the elements having ID as a container on the page.

#container {
  width: 960px;
  margin: 0 auto;
}

<div id="container"></div>

Class Selector: The class selector also matches all elements on the page that have their class attribute set to the same value as the class. In the given example, the provided styles will get applied to all the elements having ID as the box on the page.

.box {
  padding: 10px;
  margin: 10px;
  width: 240px;
}

<div class="box"></div>

Descendant Combinator: The descendant selector or, more accurately, the descendant combinator lets you combine two or more selectors so you can be more specific in your selection method.

#container .box {
	float: left;
	padding-bottom: 15px;
} 

<div id="container">
	<div class="box"></div>
	
	<div class="box-2"></div>
</div>

<div class=”box”></div>

This declaration block will apply to all elements that have a class of box that is inside an element with an ID of the container. It’s worth noting that the .box element doesn’t have to be an immediate child: there could be another element wrapping .box, and the styles would still apply.

Child Combinator: A selector that uses the child combinator is similar to a selector that uses a descendant combinator, except it only targets immediate child elements.

#container> .box {
	float: left;
	padding-bottom: 15px;
}

<div id="container">
	<div class="box"></div>
	
	<div>
		<div class="box"></div>
	</div>
</div>

The selector will match all elements that have a class of box and that are immediate children of the #container element. That means, unlike the descendant combinator, there can’t be another element wrapping .box it has to be a direct child element.

General Sibling Combinator: A selector that uses a general sibling combinator to match elements based on sibling relationships. The selected elements are beside each other in the HTML.

h2 ~ p {
	margin-bottom: 20px;
}

<h2>Title</h2>
<p>Paragraph example.</p>
<p>Paragraph example.</p>
<p>Paragraph example.</p>
<div class=”box”>
	<p>Paragraph example.</p>
</div>

In this example, all paragraph elements (<p>) will be styled with the specified rules, but only if they are siblings of <h2> elements. There could be other elements in between the <h2> and <p>, and the styles would still apply.

Adjacent Sibling Combinator: A selector that uses the adjacent sibling combinator uses the plus symbol (+), and is almost the same as the general sibling selector. The difference is that the targeted element must be an immediate sibling, not just a general sibling.

p + p {
	text-indent: 1.Sem;
	margin-bottom: 0;
}

<h2>Title</h2>
<p>Paragraph example.</p>
<p>Paragraph example.</p>
<p>Paragraph example.</p>

<div class=”box”>
	<p>Paragraph example.</p>
	<p>Paragraph example.</p>
</div>

The above example will apply the specified styles only to paragraph elements that immediately follow other paragraph elements. This means the first paragraph element on a page would not receive these styles. Also, if another element appeared between two paragraphs, the second paragraph of the two wouldn’t have the styles applied.

Attribute Selector: The attribute selector targets elements based on the presence and/or value of HTML attributes, and is declared using square brackets.

input [type=”text”] {
	background-color: #444;
	width: 200px;
}

<input type="text">

6. What is a CSS Preprocessor? What are Sass, Less, and Stylus? Why do people use them?

A CSS Preprocessor is a tool used to extend the basic functionality of default vanilla CSS through its own scripting language. It helps us to use complex logical syntax like – variables, functions, mixins, code nesting, and inheritance to name a few, supercharging your vanilla CSS.

SASS: Sass is the acronym for “Syntactically Awesome Style Sheets”. SASS can be written in two different syntaxes using SASS or SCSS

SASS vs SCSS

SASS is based on indentation and SCSS(Sassy CSS) is not.
SASS uses the .sass extension while SCSS uses the .scss extension.
SASS doesn’t use curly brackets or semicolons. SCSS uses it, just like the CSS.

SASS Syntax

$font-color: #fff 
$bg-color: #00f

#box
	color: $font-color
	background: $bg-color

SCSS Syntax

$font-color: #fff;
$bg-color: #00f;

#box{
	color: $font-color;
	background: $bg-color;
}

LESS: LESS is an acronym for “Leaner Stylesheets”. LESS is easy to add to any javascript projects by using NPM or less.js file. It uses the extension .less.

LESS syntax is the same as the SCSS with some exceptions. LESS uses @ to define the variables.

@font-color: #fff;
@bg-color: #00f

#box{
	color: @font-color;
	background: @bg-color;
}

Stylus: Stylus offers a great deal of flexibility in writing syntax, supports native CSS as well as allows omission of brackets, colons, and semicolons. It doesn’t use @ or $ for defining variables.

/* STYLUS SYNTAX WRITTEN LIKE NATIVE CSS */
font-color= #fff;
bg-color = #00f;

#box {
	color: font-color;
	background: bg-color;
}

/* OR */

/* STYLUS SYNTAX WITHOUT CURLY BRACES */
font-color= #fff;
bg-color = #00f;

#box
	color: font-color;
	background: bg-color;

7. What is VH/VW (viewport height/ viewport width) in CSS?

It’s a CSS unit used to measure the height and width in percentage with respect to the viewport. It is used mainly in responsive design techniques. The measure VH is equal to 1/100 of the height of the viewport. If the height of the browser is 1000px, 1vh is equal to 10px. Similarly, if the width is 1000px, then 1 vw is equal to 10px.

8. Difference between reset vs normalized CSS? How do they differ?

Reset CSS: CSS resets aim to remove all built-in browser styling. For example margins, paddings, font sizes of all elements are reset to be the same.

Normalize CSS: Normalize CSS aims to make built-in browser styling consistent across browsers. It also corrects bugs for common browser dependencies.

9. What is the difference between inline, inline-block, and block?

Block Element: The block elements always start on a new line. They will also take space for an entire row or width. List of block elements are <div>, <p>.

Inline Elements: Inline elements don’t start on a new line, they appear on the same line as the content and tags beside them. Some examples of inline elements are <a>, <span> , <strong>, and <img> tags.

Inline Block Elements: Inline-block elements are similar to inline elements, except they can have padding and margins and set height and width values.

10. Is it important to test the webpage in different browsers?

It’s most important to test a website in different browsers when you’re first designing it, or when making major changes. However, it’s also important to repeat these tests periodically, since browsers go through a lot of updates and changes.

11. What are Pseudo elements and Pseudo classes?

Pseudo-elements allow us to create items that do not normally exist in the document tree, for example::after.

::before
::after
::first-letter
::first-line
::selection

In the below example, the color will appear only on the first line of the paragraph.

p: :first-line {
	color: #ffOOOO;
	font-variant: small-caps;
}

Pseudo-classes select regular elements but under certain conditions like when the user is hovering over the link.

: link
: visited
: hover
: active
: focus

Example of the pseudo-class, In the below example, the color applies to the anchor tag when it’s hovered.

/* mouse over link */
a:hover {
	color: #FFOOFF;
}

12. How do you specify units in the CSS? What are the different ways to do it?

There are different ways to specify units in CSS like px, em, pt, and percentage (%). px(Pixel) gives fine-grained control and maintains alignment because 1 px or multiple of 1 px is guaranteed to look sharp. px is not cascade. em maintains relative size. you can have responsive fonts. Em, will cascade 1em is equal to the current font size of the element or the browser default. If u sent font size to 16px then 1em = 16px. The common practice is to set the default body font size to 62.5% (equal to 10px).

pt(point) are traditionally used in print. 1pt = 1/72 inch and it is a fixed-size unit.

%(percentage) sets font size relative to the font size of the body. Hence, you have to set the font size of the body to a reasonable size.

13. Does margin-top or margin-bottom have an effect on inline elements?

No, it doesn’t affect the inline elements. Inline elements flow with the contents of the page.

14. What property is used for changing the font face?

We can use the font-family property to achieve this. The font-family property is used for specifying what font needs to be applied on the targetted DOM element. It can hold several font names as part of a “fallback” mechanism in case the browser does not support the fonts. For example, we can use:

 p {
  font-family: "Times New Roman", Times, serif;
}

In the above piece of code, we are applying font-family property to the paragraph element.

It tells the browser to look for “Times New Roman” font and apply it.
If the “Times New Roman” font is not installed or supported, then it asks the browser to use Times font.
If both “Times New Roman” and Times are not supported, then it asks the browser to use any supported generic font belonging to serif.

If you do not want the font face of the paragraph element to be Times New Roman/Times/serif font, and you want to use the Arial/Helvetica/sans-serif font, then we can just update the CSS property of the paragraph element as:

 p {
  font-family: Arial, Helvetica, sans-serif;
}

15. What are the differences between adaptive design and responsive design?

Adaptive Design	Responsive Design
Adaptive design focuses on developing websites based on multiple fixed layout sizes.	Responsive design focuses on showing content on the basis of available browser space.
When a website developed using responsive design is opened on a desktop browser and when we try to resize the browser window, the content of the website is dynamically and optimally rearranged to accommodate the window.	This design makes use of CSS media queries for changing styles depending on the target device properties for adapting to different screens.
When a website developed using the adaptive design is opened on the desktop browser, first the available space is detected and then the layout with most appropriate sizes is picked and used for the display of contents. Resizing of browser window has no effect on the design.	When a website developed using the adaptive design is opened on the desktop browser, first the available space is detected and then the layout with the most appropriate sizes is picked and used for the display of contents. Resizing of browser window has no effect on the design.
Usually, adaptive designs use six standard screen widths – 320 px, 480 px, 760 px, 960 px, 1200 px, and 1600 px. These sizes are detected and appropriate layouts are loaded.	Generally, Responsive design takes much less work to build and design fluid websites that can accommodate content from the screen depending on the screen size.
Gives a lot of control over the design to develop sites for specific screens.	No much control over the design is offered here.

16. How are the CSS selectors matched against the elements by the browser?

The order of matching selectors goes from right to left of the selector expression. The elements in the DOM are filtered by browsers based on the key selectors and are then traversed up to the parent elements to determine the matches. The speed of determining the elements depends on the length of the chain of selectors. Consider an example:

 p span{ 
    color: black;
}

Here, the browser first finds all span elements in the DOM and then it traverses to each of its parent elements to check if they are the paragraph p elements.

Once the browser finds all matching span tags having paragraph elements as parents and applies the color black to the content, the matching process is stopped.

17. How is the border box different from the content box?

content-box is the default value box-sizing property. The height and the width properties consist only of the content by excluding the border and padding. Consider an example as shown:

div{
    width:300px;
    height:200px;
    padding:15px;
    border: 5px solid grey;
    margin:30px;
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
}

Here, the box-sizing for the div element is given as content-box. That means the height and width considered for the div content exclude the padding and border. We will get full height and width parameters specified for the content as shown in the below image.

The border-box property includes the content, padding, and border in the height and width properties. Consider an example as shown:

div{
    width:300px;
    height:200px;
    padding:15px;
    border: 5px solid grey;
    margin:30px;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}

Here, the box-sizing for the div element is given as a border box. That means the height and width considered for the div content will also include the padding and border. This means that the actual height of the div content will be:

actual height = height - 
                padding on top and bottom - 
                border on top and bottom
              = 200 - (15*2) - (5*2) 
              = 160 px

and the actual width of the div content would be:

actual width  = width - 
                padding on right and left - 
                border on right and left
              = 300 - (15*2) - (5*2) 
              = 260 px

This is represented in the image below:

18. How is opacity specified in CSS3?

Opacity refers to the degree to which the content is transparent or opaque. We can use the property named opacity which takes the values ranging from 0 to 1. 0 specifies that the element is completely transparent whereas 1 means that the element is completely opaque. We can use the opacity property as follows:

 div { 
    opacity: 0.6;
}

In the above example, an opacity of 60% is applied to the div section. The opacity property is not supported by the Internet Explorer browser. To make it work there, we need to use the filter property as polyfill as shown in the example below.

 div { 
    opacity: 0.6;
    filter: alpha(opacity=60);
}

19. Why should we use float property in CSS?

The float property is used for positioning the HTML elements horizontally either toward the left or right of the container. For instance,

 float-demo {
     float: right; 
}

Here, the element to which the class is applied ensures that the element is positioned on the right of the container. If you specify the value of float as left, then the element will be placed on the left side of the container.

20. What is a z-index, how does it function?

z-index is used for specifying the vertical stacking of the overlapping elements that occur at the time of its positioning. It specifies the vertical stack order of the elements positioned which helps to define how the display of elements should happen in cases of overlapping.

The default value of this property is 0 and can be either positive or negative. Apart from 0, the values of the z-index can be:

Auto: The stack order will be set equal to the parent.
Number: The number can be positive or negative. It defines the stack order.
Initial: The default value of 0 is set to the property.
Inherit: The properties are inherited from the parent.

The elements having a lesser value of z-index is stacked lower than the ones with a higher z-index.

From the above figure, we can see that as the value of the z-index increases along the z-axis, the order of stacking would be towards the top of other elements along the vertical axis.

Frequently Asked interview questions on JavaScript(JS)!

1) What is JavaScript?

JavaScript is a scripting language. It is different from Java language. It is an object-based, lightweight, cross-platform translated language. It is widely used for client-side validation. The JavaScript Translator (embedded in the browser) is responsible for translating the JavaScript code for the web browser. More details.

2) List some features of JavaScript.

Some of the features of JavaScript are:

Lightweight
Interpreted programming language
Good for the applications which are network-centric
Complementary to Java
Complementary to HTML
Open source

3) Who developed JavaScript, and what was the first name of JavaScript?

JavaScript was developed by Brendan Eich, who was a Netscape programmer. Brendan Eich developed this new scripting language in just ten days in the year September 1995. At the time of its launch, JavaScript was initially called Mocha. After that, it was called Live Script and later known as JavaScript.

4) List some of the advantages of JavaScript.

Some of the advantages of JavaScript are:

Server interaction is less
Feedback to the visitors is immediate
Interactivity is high
Interfaces are richer

5) List some of the disadvantages of JavaScript.

Some of the disadvantages of JavaScript are:

No support for multithreading
No support for multiprocessing
Reading and writing of files is not allowed
No support for networking applications.

6) Define a named function in JavaScript.

The function which has been named at the time of definition is called a named function. For example

function msg()
{
document.writeln(“Named Function”);
}
msg();

7) Name the types of functions

The types of functions are:

Named – These type of functions contains name at the time of definition. For Example:
function display()
{
document.writeln(“Named Function”);
}
display();
Anonymous – These type of functions doesn’t contain any name. They are declared dynamically at runtime.
var display=function()
{
document.writeln(“Anonymous Function”);
}
display();

8) Define an anonymous function

It is a function that has no name. These functions are declared dynamically at runtime using the function operator instead of the function declaration. The function operator is more flexible than a function declaration. It can be easily used in the place of an expression. For example:

var display=function()
{
alert(“Anonymous Function is invoked”);
}
display();

9) Can an anonymous function be assigned to a variable?

Yes, you can assign an anonymous function to a variable.

10) In JavaScript what is an argument object?

The variables of JavaScript represent the arguments that are passed to a function.

11) Define closure.

In JavaScript, we need closures when a variable that is defined outside the scope in reference is accessed from some inner scope.

var num = 10;
function sum()
{
document.writeln(num+num);
}
sum();

12) If we want to return the character from a specific index which method is used?

The JavaScript string charAt() method is used to find out a char value present at the specified index. The index number starts from 0 and goes to n-1, where n is the length of the string. The index value can’t be a negative, greater than or equal to the length of the string. For example:

var str=”Javatpoint”;
document.(str.charAt(4));

13) What is the difference between JavaScript and JScript?

Netscape provided the JavaScript language. Microsoft changed the name and called it JScript to avoid the trademark issue. In other words, you can say JScript is the same as JavaScript, but Microsoft provides it.

14) How to write a hello world example of JavaScript?

A simple example of JavaScript Hello World is given below. You need to place it inside the body tag of HTML.

<script type=”text/javascript”>
document.write(“JavaScript Hello World!”);
</script>

15) What are the key differences between Java and JavaScript? / How is JavaScript different from Java?

JavaScript is a lightweight programming language (most commonly known as scripting language) developed by Netscape, Inc. It is used to make web pages interactive. It is not a part of the Java platform. Following is a list of some key differences between Java and JavaScript

A list of key differences between Java and JavaScript

Java	JavaScript
Java is a complete and strongly typed programming language used for backend coding. In Java, variables must be declared first to use in the program, and the type of a variable is checked at compile-time.	JavaScript is a weakly typed, lightweight programming language (most commonly known as scripting language) and has more relaxed syntax and rules.
Java is an object-oriented programming (OOPS) language or structured programming languages such as C, C++, or .Net.	JavaScript is a client-side scripting language, and it doesn’t fully support the OOPS concept. It resides inside the HTML documents and is used to make web pages interactive (not achievable with simple HTML).
Java creates applications that can run in any virtual machine (JVM) or browser.	JavaScript code can run only in the browser, but it can now run on the server via Node.js.
The Java code needs to be compiled.	The JavaScript code doesn’t require to be complied.
Java Objects are class-based. You can’t make any program in Java without creating a class.	JavaScript Objects are prototype-based.
Java is a Complete and Standalone language that can be used in backend coding.	JavaScript is assigned within a web page and integrates with its HTML content.
Java programs consume more memory.	JavaScript code is used in HTML web pages and requires less memory.
The file extension of the Java program is written as “.Java” and it translates source code into bytecodes which are then executed by JVM (Java Virtual Machine).	The JavaScript file extension is written as “.js” and it is interpreted but not compiled. Every browser has a JavaScript interpreter to execute the JS code.
Java supports multithreading.	JavaScript doesn’t support multithreading.
Java uses a thread-based approach to concurrency.	JavaScript uses an event-based approach to concurrency.

16) How to use an external JavaScript file?

I am assuming that the js file name is message.js, place the following script tag inside the head tag.

<script type=”text/javascript” src=”message.js”></script>

More details.

17) Is JavaScript case-sensitive language?

Yes, JavaScript is a case-sensitive language. For example:

Var msg = “JavaScript is a case-sensitive language”; //Here, var should be used to declare a variable
function display()
{
document.writeln(msg); // It will not display the result.
}
display();

18) What is BOM?

BOM stands for Browser Object Model. It provides interaction with the browser. The default object of a browser is a window. So, you can call all the functions of the window by specifying the window directly. The window object provides various properties like document, history, screen, navigator, location, innerHeight, innerWidth,

19) What is DOM? What is the use of a document object?

DOM stands for Document Object Model. A document object represents the HTML document. It can be used to access and change the content of HTML. More Details: Document Object Model

20) What is the use of a window object?

The window object is created automatically by the browser and represents a window of a browser. It is not an object of JavaScript. It is a browser object.

The window object is used to display the popup dialog box. Let’s see with the description.

Method	Description
alert()	performs the action after a specified time like calling function, or evaluating expressions.
confirm()	performs the action after a specified time like calling function, evaluating expressions.
prompt()	displays a dialog box to get input from the user.
open()	opens the new window.
close()	closes the current window.
setTimeout()	performs the action after a specified time like calling function, or evaluating expressions.

Frequently Asked interview questions on PHP!

1. Differentiate between static and dynamic websites.

Static Website	Dynamic Website
The content cannot be manipulated after the script is executed	The content can be changed even at the runtime
No way to change the content as it is predefined	The content can be changed easily by manipulation and reloading

2. What is PHP most used for?

PHP has a plethora of uses for developers and the ones mentioned below are some of the most widely used concepts that PHP offers:

With PHP, it becomes very easy to provide restricted access to the required content of the website.
It allows users to access individual cookies and set them as per requirement.
Database manipulation operations, such as addition, deletion, and modification, can be done easily.
Form handling, alongside features that involve file-handling concepts and email integration, is used widely.
The system module allows users to perform a variety of system functions such as open, read, write, etc.

3. Is PHP a case-sensitive scripting language?

The answer to this is both yes and no. Variables and their declaration in PHP are completely case-sensitive while function names are not.

For example, user-defined functions in PHP can be defined in uppercase but later referred to in lowercase, and it would still function normally.

4. What is the meaning of PEAR in PHP?

PEAR stands for PHP Extension and Application Repository. It is one of the frameworks and acting repositories that host all of the reusable PHP components. Alongside containing some of the PHP libraries, it also provides you with a simple interface in PHP to automatically install packages.

5. How is a PHP script executed?

PHP scripts can be easily executed from the command-line interface (CLI). The syntax is as follows:php filename.php

Here, filename refers to the file that contains scripts. The extension .php is needed alongside the filename.

6. What are the types of variables present in PHP?

There are eight primary data types in PHP as shown below:

Array: A named and ordered collection of data
Boolean: A logical value (True or False)
Double: Floating point numbers such as 5.1525
Integer: Whole numbers without a floating point
Object: An instance of classes, containing data and functions
NULL: A special data type, supporting only the NULL data
Resource: Special variables that hold references to external resources
String: A sequence of characters such as, “Hello learners!”

7. What are the variable-naming rules you should follow in PHP?

There are two main rules that you have to follow when naming a variable in PHP. They are as follows:

Variables can only begin with letters or underscores.
Special characters such as +, %, -, &, etc. cannot be used.

8. What are the main characteristics of a PHP variable?

Following are some of the most important aspects of the usage of variables in PHP:

Variables can be declared before the value assignment.
A variable value assignment happens using the ‘=’ operator.
Every variable in PHP is denoted with a $ (dollar) sign.
The value of a variable depends on its latest assigned value.
PHP variables are not intrinsic. There is no explicit declaration.

9. What is NULL in PHP?

NULL is a special data type in PHP used to denote the presence of only one value, NULL. You cannot assign any other value to it.

NULL is not case sensitive in PHP and can be declared in two ways as shown below:$var = NULL:

Or$var = null;

Both of the above syntaxes work fine in PHP.

10. How are constants defined in PHP?

Constants can be defined easily in PHP by making use of the define() function. This function is used to define and pull out the values of the constants easily.

Constants, as the name suggests, cannot be changed after being definition. They do not require the PHP syntax of starting with the conventional $ sign.

11. What is the use of the constant() function in PHP?

The constant() function is used to retrieve the values predefined in a constant variable. It is used especially when you do not know the name of the variable.

12. What are the various constants predefined in PHP?

PHP consists of many constants, and the following are some of the more widely used ones:

_METHOD_: Represents the class name
_CLASS_: Returns the class name
_FUNCTION_: Denotes the function name
_LINE_: Denotes the working line number
_FILE_: Represents the path and the file name

13. Differentiate between variables and constants in PHP.

Variable	Constant
Variables can have changed paths	Constants cannot be changed
The default scope is the current access scope	Constants can be accessed throughout without any scoping rules
The $ assignment is used for definition	Constants are defined using the define() function
Compulsory usage of the $ sign at the start	No need for the $ sign for constants

14. What does the phrase ‘PHP escape’ mean?

PHP escape is a mechanism that is used to tell the PHP parser that certain code elements are different from the PHP code. This provides the basic means to differentiate a piece of PHP code from the other aspects of the program.

15. Differentiate between PHP4 and PHP5.

PHP4	PHP5
No support for static methods	Allows the usage of static methods
Abstract classes cannot be declared	Abstract classes can be declared
The method of call-by-value is used	The method of call-by-reference is used
Constructors can have class names	Constructors have separate names

16. How are two objects compared in PHP?

PHP provides you with the ‘==’ operator, which is used to compare two objects at a time. This is used to check if there is a common presence of attributes and values between the objects in comparison.

The ‘===’ operator is also used to compare if both objects in consideration are referencing to the same class.

17. What is the meaning of break and continue statements in PHP?

Break: This statement is used in a looping construct to terminate the execution of the iteration and to immediately execute the next code snippet outside the scope of the iterating statement.

Continue: This statement is used to skip the current iteration of the loop and continue to execute the next iteration until the looping construct is exited.

18. What are some of the popular frameworks in PHP?

There are many frameworks in PHP that are known for their usage. Following are some of them:

CodeIgniter
CakePHP
Laravel
Zend
Phalcon
Yii 2

19. What is the use of the final class and the final method in PHP?

The ‘final’ keyword, if present in a declaration, denotes that the current method does not support overriding by other classes. This is used when there is a requirement to create an immutable class.

Note: Properties cannot be declared as final. It is only the methods and classes that get to be final.

20. How does JavaScript interact with PHP?

JavaScript is a client-side programming language, while PHP is a server-side scripting language. PHP has the ability to generate JavaScript variables, and this can be executed easily in the browser, thereby making it possible to pass variables to PHP using a simple URL.

Frequently Asked interview questions on DBMS!

1. What are the advantages of DBMS over traditional file-based systems?

Database management systems were developed to handle the following difficulties of typical File-processing systems supported by conventional operating systems.
1. Data redundancy and inconsistency
2. Difficulty in accessing data
3. Data isolation – multiple files and formats
4. Integrity problems
5. Atomicity of updates
6. Concurrent access by multiple users
7. Security problems

2. What are super, primary, candidate, and foreign keys?

A super key is a set of attributes of a relation schema upon which all attributes of the schema are functionally dependent. No two rows can have the same value of super key attributes.
A Candidate key is a minimal superkey, i.e., no proper subset of Candidate key attributes can be a superkey.
A Primary Key is one of the candidate keys. One of the candidate keys is selected as the most important and becomes the primary key. There cannot be more than one primary key in a table..
A Foreign key is a field (or collection of fields) in one table that uniquely identifies a row of another table.

3. What is the difference between primary key and unique constraints?

The primary key cannot have NULL value, the unique constraints can have NULL values. There is only one primary key in a table, but there can be multiple unique constraints.

4. What is database normalization?

It is a process of analyzing the given relation schemas based on their functional dependencies and primary keys to achieve the following desirable properties:
1. Minimizing Redundancy
2. Minimizing the Insertion, Deletion, And Update Anomalies Relation schemas that do not meet the properties are decomposed into smaller relation schemas that could meet desirable properties.

5. Why is the use of DBMS recommended? Explain by listing some of its major advantages.

Some of the major advantages of DBMS are as follows:

Controlled Redundancy: DBMS supports a mechanism to control the redundancy of data inside the database by integrating all the data into a single database and as data is stored in only one place, the duplicity of data does not happen.
Data Sharing: The sharing of data among multiple users simultaneously can also be done in DBMS as the same database will be shared among all the users and by different application programs.
Backup and Recovery Facility: DBMS minimizes the pain of creating the backup of data again and again by providing a feature of ‘backup and recovery’ which automatically creates the data backup and restores the data whenever required.
Enforcement of Integrity Constraints: Integrity Constraints are very important to be enforced on the data so that the refined data after putting some constraints are stored in the database and this is followed by DBMS.
Independence of Data: It simply means that you can change the structure of the data without affecting the structure of any of the application programs.

6. What are the differences between DDL, DML, and DCL in SQL?

Following are some details of three :
DDL stands for Data Definition Language. SQL queries like CREATE, ALTER, DROP, TRUNCATE and RENAME come under this.
DML stands for Data Manipulation Language. SQL queries like SELECT, INSERT, DELETE and UPDATE come under this.
DCL stands for Data Control Language. SQL queries like GRANT and REVOKE come under this.

7. What is the difference between having and where clause?

HAVING is used to specify a condition for a group or an aggregate function used in a select statement. The WHERE clause selects before grouping. The HAVING clause selects rows after grouping. Unlike the HAVING clause, the WHERE clause cannot contain aggregate functions. (See this for examples). See Having vs Where Clause? for more details

8. How to print duplicate rows in a table?

In a relational database, you can find and print duplicate rows in a table using the GROUP BY and HAVING clauses along with the COUNT aggregate function.

9. What is Join?

An SQL Join is used to combine data from two or more tables, based on a common field between them. For example, consider the following two tables.

Table – Student Table

EnrollNo	StudentName	Address
1000	geek1	geeksquiz1
1001	geek2	geeksquiz2
1002	geek3	geeksquiz3

Table – StudentCourse Table

javascript:false

CourseID	EnrollNo
1	1000
2	1000
3	1000
1	1002
2	1003

Following is a join query that shows the names of students enrolled in different courseIDs. SELECT StudentCourse.CourseID, Student.StudentName FROM StudentCourse INNER JOIN Student ON StudentCourse.EnrollNo = Student.EnrollNo ORDER BY StudentCourse.CourseID;

The above query would produce the following result.

CourseID	StudentName
1	geek1
1	geek3
2	geek1
3	geek1

10. What is a view in SQL? How to create a view?

A view is a virtual table based on the result set of an SQL statement. We can create it using the create view syntax.
CREATE VIEW view_name AS SELECT column_name(s) FROM table_name WHERE condition

11. What are the uses of view?

1. Views can represent a subset of the data contained in a table; consequently, a view can limit the degree of exposure of the underlying tables to the outer world: a given user may have permission to query the view, while denied access to the rest of the base table.
2. Views can join and simplify multiple tables into a single virtual table.
3. Views can act as aggregated tables, where the database engine aggregates data (sum, average, etc.) and presents the calculated results as part of the data.
4. Views can hide the complexity of data.
5. Views take very little space to store; the database contains only the definition of a view, not a copy of all the data that it presents.
6. Depending on the SQL engine used, views can provide extra security.

12. What is a Trigger?

A Trigger is a code associated with insert, update or delete operations. The code is executed automatically whenever the associated query is executed on a table. Triggers can be useful to maintain integrity in the database.

13. What is a stored procedure?

A stored procedure is like a function that contains a set of operations compiled together. It contains a set of operations that are commonly used in an application to do some common database tasks.

14. What is the difference between Trigger and Stored Procedure?

Unlike Stored Procedures, Triggers cannot be called directly. They can only be associated with queries.

15. What is a transaction? What are ACID properties?

A Database Transaction is a set of database operations that must be treated as a whole, which means either all operations are executed or none of them. An example can be a bank transaction from one account to another account. Either both debit and credit operations must be executed or none of them. ACID (Atomicity, Consistency, Isolation, Durability) is a set of properties that guarantee that database transactions are processed reliably.

16. What are indexes?

A database index is a data structure that improves the speed of data retrieval operations on a database table at the cost of additional writes and the use of more storage space to maintain the extra copy of data. Data can be stored only in one order on a disk. To support faster access according to different values, faster search like binary search for different values is desired, For this purpose, indexes are created on tables. These indexes need extra space on the disk, but they allow faster search according to different frequently searched values.

17. What are clustered and non-clustered Indexes?

Clustered indexes are the index according to which data is physically stored on a disk. Therefore, only one clustered index can be created on a given database table.
Non-clustered indexes don’t define the physical ordering of data, but logical ordering. Typically, a tree is created whose leaf points to disk records. B-Tree or B+ tree are used for this purpose.

18. What is Denormalization?

Denormalization is a database optimization technique in which we add redundant data to one or more tables.

19. What is CLAUSE in SQL?

A clause in SQL is a part of a query that lets you filter or customize how you want your data to be queried to you.

20. What is a Live Lock?

A livelock situation can be defined as when two or more processes continually repeat the same interaction in response to changes in the other processes without doing any useful work These processes are not in the waiting state, and they are running concurrently. This is different from a deadlock because in a deadlock all processes are in the waiting state.

WhatsApp Group Join Now

Telegram Group Join Now

Instagram Group Join Now

Linkedin Page Join Now