GatsbyJS Test

What will the following code output?

A: 24 after 5 seconds and after another 5 seconds, another 24
B: 24 followed by another 24 immediately
C: 24 immediately and another 24 after 5 seconds
D: After 5 seconds, 24 and 24
E: Undefined
F: NaN
G: None of these

Review the following JavaScript code and pick the correct options: 

Assume that the API returns a successful 200 response code and a JSON object as the response body. What would the value of ‘a’ be after the code is executed?

What will the output of the following JavaScript code be?

What does the following code output? 

What does the following JS code output?

Review the following React code:

Pick the correct statements:

A: The code renders 10 INDIAN RUPEE
B: The code renders 10 SINGAPORE DOLLAR
C: The code does not render anything and throws an error since JavaScript objects are not valid as React children
D: When the currency portion is clicked, the parent component is re-rendered
E: When the currency portion is clicked, parent component will skip the re-render because shouldComponentUpdate returns false
F: Parent component can be converted to a functional component with memoization (useMemo or memo) to avoid the re-render

Consider a React functional component that utilizes various hooks and conditional rendering. The component is designed to fetch and display a list of items from an API, with the ability to filter the list based on user input. Here's the pseudo-code structure:

In this component, which of the following is a potential issue or inefficiency?

A: The component will re-render excessively due to the `setFilter` call.
B: The `useEffect` hook will run on every render, causing performance issues.
C: The `fetchItems` function may cause a memory leak if the component unmounts during the fetch.
D: The `useMemo` hook for `filteredItems` is unnecessary and can be removed without impact.
E: The component will fail to display items when the filter is cleared.
F: There are no significant issues; the component is implemented optimally.

Which of the following React code snippets
- triggers the reducer ‘rhymeReducer’ to update the ‘song’ value to ‘Jack and Jill’
- renders the updated ‘song’ value
- does not produce any errors/warnings

Consider a React application where a custom hook `useComplexState` is defined to manage a complex state object. The application also uses the Context API to pass down the state and dispatch function. Below is the pseudo-code for the custom hook and a component using it:

Given this setup, which of the following statements best describes the potential issue or challenge with `MyComponent`?

A: The component will not re-render when the global state changes.
B: The `fetchData` function will cause an infinite loop of re-renders.
C: The component will lose its state when the global state updates.
D: There will be a memory leak due to improper cleanup in `useEffect`.
E: The `dispatch` function from `useComplexState` will conflict with the global dispatch.
F: There is no issue; the component is implemented correctly.

Consider the following shorthand CSS example:

background: #f7f7f7 url(jolie.jpg) no-repeat scroll 0px 0px;

Which of the following show the individual background properties represented by the shorthand:

Our intern is writing a colorful blog post, and has written the following code. What colors will the sentences be?

A: Sentence 1 will be gray, Sentence 2 will be pink.
B: Both sentences will be gray.
C: Sentence 1 will be pink, Sentence 2 will be gray.
D: Both sentences will be pink.
E: The code does not make sense; will throw an error.

In the following HTML, what will be the color of link with class "mark"

Consider the following HTML and CSS:

Which additional CSS rule(s) will render the following image? Choose ALL that apply.

A:
div{
  flex-direction : column;
  align-items : center;
}

B:
div{
  flex-direction : row;
  align-items: center;
}

C:
div{
  flex-direction: column;
  justify-content: center;
}

D:
div{
  flex-direction: row;
  justify-content: center;
}