MCSD MCSD Programming in HTML5 5 — Questions and Answers
Question 1: Which JavaScript ES6 feature allows you to extract values from arrays or objects into distinct variables?
- Spread operator
- Destructuring assignment (Correct answer)
- Template literals
- Arrow functions
Correct answer: Destructuring assignment
Destructuring assignment lets you unpack values from arrays or properties from objects into separate variables using a concise syntax.
Question 2: What is the purpose of the HTML5 `<picture>` element?
- To embed videos from external sources
- To provide multiple image sources for responsive and art-direction use cases (Correct answer)
- To display SVG graphics inline
- To create image maps with clickable regions
Correct answer: To provide multiple image sources for responsive and art-direction use cases
The `<picture>` element holds multiple `<source>` elements, letting the browser pick the most appropriate image based on media queries or format support.
Question 3: In CSS Grid, which property defines the size and number of columns in the grid?
- grid-template-rows
- grid-auto-columns
- grid-template-columns (Correct answer)
- column-count
Correct answer: grid-template-columns
`grid-template-columns` sets the number and width of explicit columns in a grid container, accepting values like `repeat(3, 1fr)`.
Question 4: Which HTML5 attribute on a `<script>` tag makes the script download in parallel without blocking HTML parsing and execute after parsing completes?
- defer (Correct answer)
- async
- preload
- module
Correct answer: defer
The `defer` attribute downloads the script without blocking parsing and guarantees execution after the document has been parsed, in order.
Question 5: Which method on the Fetch API is used to parse a JSON response body?
- response.text()
- response.json() (Correct answer)
- response.data()
- response.parse()
Correct answer: response.json()
`response.json()` reads the Response body and returns a Promise that resolves to the result of parsing it as JSON.
Question 6: What does the CSS `em` unit measure relative to?
- The root element's font size
- The viewport width
- The font size of the element itself (or parent for some properties) (Correct answer)
- The default browser font size of 16px always
Correct answer: The font size of the element itself (or parent for some properties)
The `em` unit is relative to the font-size of the element; for font-size itself it's relative to the parent's font-size.
Question 7: Which HTML5 API would you use to run CPU-intensive JavaScript without blocking the main UI thread?
- SharedArrayBuffer
- Web Workers (Correct answer)
- Service Workers
- IndexedDB
Correct answer: Web Workers
Web Workers run scripts in a background thread, keeping the main thread responsive while handling heavy computations.
Which JavaScript ES6 feature allows you to extract values from arrays or objects into distinct variables?