January 9, 2025

Interview Question

HTML INTERVIEW QUESTION

Which of the following tags do not required a terminator?
  1.  <u>
  2. <br>
  3. <b>
  4. None of the above
Ans. <br>
  1. <h1>
  2. <ul>
  3. <ol>
  4. None of the above

Ans. <ol>

  1. <image>
  2. <images>
  3. <img>
  4. <graphics>

Ans. <img>

  1. <marquee>
  2. </img>
  3. <a href>
  4. None of the above

Ans. <marquee>

  1. <!-and->
  2. <! And !>
  3. <!—and—“”
  4. None of the above

Ans. <!-and->

  1. .htx or .html
  2. .html or .html
  3. .hmt or .hmtl
  4. .htm or .html

Ans. .htm or .html

  1. BR tag is used to have a blank line.
  2. In tables, the header cell is centered by default and the data cells are right-aligned.
  3. The <TR> is used to create a data cell.
  4. None of the statements are true

Ans. None of the statements are true

  1. <HL>
  2. <HR>
  3. <UR>
  4. None of the above

Ans. <HR>

  1. Joint photographics embedded group
  2. Joint photographics extended group
  3. Joint photographic experts group
  4. None of the above

Ans. Joint Photographic Experts Group

  1. Tagged image file format
  2. Textual images file format
  3. Tagged image font file
  4. None of the above

Ans. Tagged image file format

  1. <abbr> </abbr>
  2. <acronym> </acronym>
  3. Both of the above
  4. None of the above

Ans. <abbr> </abbr>

  1. To translate the domain name of another computer into IP address only
  2. To translate the domain name of another computer into IP address and vice versa on request
  3. To translate the IP address to the domain name
  4. None of the above

Ans. To translate the IP address to the domain name

CSS INTERVIEW QUESTION

What is CSS?

CSS stands for Cascading Style Sheets. It is used to style and layout web pages, including design elements such as color, font, and spacing.

There are three types of CSS:

  1. Inline CSS
  2. Internal CSS
  3. External CSS
  • id is used to target a unique element, and it must be unique within a page.
  • class can be reused multiple times in different elements.

The CSS box model defines rectangular boxes generated for elements in the document tree. These are: content, padding, border, and margin

You can include a CSS file using the <link> tag inside the <head> section

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

The z-index property specifies the stack order of the elements. Elements with higher z-index are displayed in front of elements with a lower z-index.

  • absolute: Positioned relative to the nearest ancestor.
  • relative: Positioned relative to its normal position.
  • fixed: Positioned relative to the browser window.
  • sticky: Acts like relative until a defined scroll point, then behaves like fixed.

Pseudo-classes define a special state of an element. Examples include :hover, :focus, :active, :nth-child(), etc.

Media queries are used to apply different styles based on conditions such as screen width, device type, or orientation. Example:

				
					@media (max-width: 600px) {
  body {
    background-color: lightblue;
  }
}
				
			
  • display: none: The element is removed from the document flow, and it takes up no space.
  • visibility: hidden: The element is still in the document flow, but it is invisible.

Flexbox is a layout model in CSS that allows you to more easily create complex layouts by distributing space along rows or columns.

CSS Grid is a two-dimensional layout system that allows creating complex layouts using rows and columns. Unlike Flexbox, which is one-dimensional (either row or column), Grid can handle both dimensions at the same time.

  • For horizontal centering: margin: 0 auto;
  • For vertical centering: Use Flexbox or Grid or apply position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);

::before and ::after are used to insert content before or after an element’s content. They are commonly used to add icons, quotes, or other visual elements.

  • position: sticky; allows an element to “stick” to a defined location as the user scrolls next to it. This is useful for creating sticky headers or navigation bars.
  • block: Elements that take up the entire width and start on a new line.
  • inline: Elements that take up only as much width as necessary and do not start on a new line.
  • inline-block: Elements that behave like inline elements but allow block-level styling.

The !important rule is used to give a CSS rule higher priority than other conflicting rules. This is generally avoided as it may cause maintenance problems.

  • em: Related to the font-size of its parent element.
  • rem: Related to the font-size of the parent element (<html>).
  • px: Absolute units, fixed in size.
  • %: Relative to the parent element’s size.

The calc() function is used to perform calculations to set CSS property values, such as width: calc(100% - 20px).

CSS animations allow smooth changes of styles over time. You create them using the @keyframes rule and apply the animation with the animation property.

JAVASCRIPT INTERVIEW QUESTION

What is JavaScript?

JavaScript is a high-level, interpreted programming language used to create dynamic and interactive web content.

JavaScript supports the following data types:

  1. Primitive: string, number, boolean, null, undefined, symbol, bigint
  2. Non-Primitive: object
  • var: Scope can be re-declared and hoisted.
  • let: Block-scoped, can’t be re-declared, can’t be hoisted.
  • const: Block-scoped, immutable, not hoisted.
  • ==: Compares values after type conversion (loose equality).
  • ===: Compares values without type conversion (strict equality).

The isNaN() function checks whether a value is NaN (Not-a-Number).

  • null: Represents the intentional absence of a value.
  • undefined: Represents a variable that has been declared but not assigned a value.

Hoisting is JavaScript’s behavior of moving declarations (var, function) to the top of their scope during compilation.

A closure is a function that has access to its outer function’s variables even after the outer function has executed.

  • Function Declaration: Defined with the function keyword and hoisted.
  • Function Expression: Assigned to a variable and not hoisted.

Promises are used to handle asynchronous operations. They can be in one of three states: pending, fulfilled, or rejected.

  • call(): Invokes a function with a specified this context and arguments.
  • apply(): Similar to call(), but takes arguments as an array.
  • bind(): Returns a new function with the specified this context.

The event loop is a mechanism that ensures non-blocking execution by handling asynchronous operations and executing callbacks.

A higher-order function is a function that takes another function as an argument or returns a function.

  • map(): Creates a new array by applying a function to each element.
  • filter(): Creates a new array with elements that pass a condition.
  • reduce(): Reduces an array to a single value by applying a function.

The value of this depends on how a function is called:

  • In a method, this refers to the object.
  • In a regular function, this refers to the global object (window in browsers).
  • Synchronous: Executes code sequentially, blocking further execution.
  • Asynchronous: Executes code without blocking, using callbacks, promises, or async/await.

async functions return promises. await pauses execution until the promise is resolved.

Destructuring is a syntax for extracting values ​​from arrays or objects:

				
					const {name, age} = person;
const [first, second] = array;
				
			

Templates allow to embed variables and expressions using literal backticks () and ${}` syntax:

				
					const greeting = `Hello, ${name}!`;
				
			
  • undefined: A variable is declared but not assigned a value.
  • not defined: A variable is not declared in the program.

Prototype is an object associated with every function and object, which is used for inheritance.

  • setTimeout: Executes a function after a delay.
  • setInterval: Executes a function repeatedly at a specified interval.