- Courses
- Tutorials
- Practice
- Jobs
React with TypeScript
Question 1
What is the purpose of PropTypes in React?
- A
To style components
- B
To provide runtime type checking for props
- C
To optimize component rendering
- D
To initialize state
Question 2
What will happen if a component receives an invalid prop type when using PropTypes?
- A
The app will crash
- B
A warning will be logged in the browser console
- C
The component will ignore the prop
- D
The app will ignore the component
Question 3
Which of the following is the correct way to integrate TypeScript with React?
- A
Use ReactTypeScript library
- B
Install react-scripts-ts
- C
Use tsx extension for files and define types for props and state
- D
TypeScript does not support React integration
Question 4
In a TypeScript React component, how would you type the state in a class component?
- A
state: T
- B
this.state: T
- C
state: ReactState<T>
- D
state: T extends React.Component
Question 5
How would you define a React component's props using TypeScript?
- A
interface MyComponentProps {}
- B
type MyComponentProps = {}
- C
Both A and B are correct
- D
React.componentProps = {}
Question 6
Given the following code, which TypeScript type should be assigned to props?
interface MyComponentProps {
name: string;
}
const MyComponent: React.FC<MyComponentProps> = (props) => {
return <div>{props.name}</div>;
};
- A
{ name: string }
- B
string
- C
React.Props
- D
any
Question 7
You are building a TypeScript React component that accepts a count prop (number). How would you type this prop?
const Counter = (props) => {
return <div>{props.count}</div>;
};
- A
Counter.propTypes = { count: PropTypes.number };
- B
const Counter: React.FC<{ count: number }> = (props) => {}
- C
const Counter = (props: { count: string }) => {}
- D
ReactComponent<{ count: number }>
Question 8
How would you type the state in a TypeScript React class component that holds a string value?
class MyComponent extends React.Component {
state = { value: '' };
render() {
return <div>{this.state.value}</div>;
}
}
- A
state: { value: string }
- B
state: string
- C
state: { value: number }
- D
state: React.State
Question 9
What is the default behavior of PropTypes if no isRequired is applied?
- A
The prop is optional and won't throw a warning if not provided
- B
The prop is required and throws an error
- C
The prop is automatically assigned a default value
- D
The app will crash if the prop is not provided
Question 10
Which of the following is the correct way to declare prop types in a functional React component?
- A
Component.propTypes = {}
- B
PropTypes.Component = {}
- C
this.propTypes = {}
- D
componentTypes = {}
There are 10 questions to complete.
