Front End Development Front-End Development 2 — Questions and Answers
Question 1: Which CSS property creates a new stacking context for an element?
- display: block
- position: relative with z-index (Correct answer)
- margin: auto
- float: left
Correct answer: position: relative with z-index
Setting position to relative, absolute, fixed, or sticky combined with a z-index value other than auto creates a new stacking context.
Question 2: In JavaScript, what does the spread operator (...) do when used with an array?
- Removes duplicate elements
- Expands the array into individual elements (Correct answer)
- Sorts the array
- Reverses the array
Correct answer: Expands the array into individual elements
The spread operator expands an iterable like an array into individual elements, useful for copying or merging arrays.
Question 3: What is the purpose of the CSS `will-change` property?
- Defines fallback styles for unsupported properties
- Hints to the browser which properties will animate for optimization (Correct answer)
- Forces GPU rendering on all elements
- Prevents layout reflow
Correct answer: Hints to the browser which properties will animate for optimization
The `will-change` property informs the browser ahead of time which properties will change, allowing it to set up optimizations like compositing layers.
Question 4: Which HTTP status code indicates a resource has been permanently moved?
- 301 (Correct answer)
- 302
- 304
- 307
Correct answer: 301
301 Moved Permanently tells the client and search engines that the resource has permanently moved to a new URL.
Question 5: In React, when does `useEffect` with an empty dependency array run?
- On every re-render
- Only once after the initial render (Correct answer)
- Before every render
- Only when props change
Correct answer: Only once after the initial render
An empty dependency array `[]` causes useEffect to run only once after the component's initial mount, similar to componentDidMount.
Question 6: What does the CSS `clip-path` property do?
- Adds a shadow to an element
- Defines a visible region by clipping the element to a shape (Correct answer)
- Applies a filter effect
- Creates a gradient background
Correct answer: Defines a visible region by clipping the element to a shape
The `clip-path` property clips an element to a defined shape such as a circle, polygon, or SVG path, hiding the parts outside the shape.
Question 7: Which JavaScript method returns a new array with only elements that pass a test function?
- map()
- reduce()
- filter() (Correct answer)
- find()
Correct answer: filter()
Array.prototype.filter() creates a new array containing only the elements for which the callback function returns true.
Which CSS property creates a new stacking context for an element?