[go: up one dir, main page]
Scribd
Upload
4 views4 pages

FrontEnd Mock Test With Answers

The document is a mock test for a Front-End Developer role, covering topics such as JavaScript, TypeScript, React, Angular, state management, and responsive design. It includes multiple-choice questions and descriptive questions with correct answers and explanations provided. The recommended time to complete the test is 30–40 minutes.

Uploaded by

Mohammad Shamsuddin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
4 views4 pages

FrontEnd Mock Test With Answers

The document is a mock test for a Front-End Developer role, covering topics such as JavaScript, TypeScript, React, Angular, state management, and responsive design. It includes multiple-choice questions and descriptive questions with correct answers and explanations provided. The recommended time to complete the test is 30–40 minutes.

Uploaded by

Mohammad Shamsuddin
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

Front-End Developer Mock Test &

Answer Key
📄 Mock Test for Front-End Developer Role

🕒 Recommended Time: 30–40 minutes

📌 Instructions: Mark the correct answers (for MCQs) and write short responses for
descriptive questions.

Section 1: JavaScript (ES6+) & TypeScript


1. Q1. What is the output of the following code?

let a = [1, 2, 3];


let b = [...a];
b.push(4);
console.log(a.length);

a) 3 ✅
Explanation: The spread operator creates a shallow copy. Pushing to b doesn't change a.

2. Q2. Which of the following is NOT a valid JavaScript data type?

a) Number
b) Undefined
c) Float
d) Symbol

c) Float ✅
Explanation: JavaScript uses a single Number type for all numbers.

3. Q3. What is the difference between `let` and `var`?

Explanation: `var` is function-scoped, hoisted. `let` is block-scoped and more predictable.

4. Q4. In TypeScript, what is the correct way to define a function that returns a number?

a) function sum(a, b): string


b) function sum(a: number, b: number): number
c) function sum(a: string, b: number): any
d) function sum(a, b): number

b) function sum(a: number, b: number): number ✅


5. Q5. What is a TypeScript interface used for?

Explanation: It defines object structure and ensures type safety.

Section 2: React & React Native


6. Q6. What does useEffect with an empty dependency array [] mean?

b) It runs only once when the component mounts ✅

7. Q7. In React, which hook is used to manage component state?

a) useProps()
b) useState()
c) useReducer()
d) useCallback()

b) useState() ✅

8. Q8. What are controlled components in React? Give an example.

Explanation: Inputs whose values are controlled via state.


Example: <input value={state} onChange={...} />

9. Q9. What is the main difference between React and React Native?

Explanation: React builds web apps; React Native builds native mobile apps using native
components.

10. Q10. How do you handle navigation in React Native apps?

a) React Router
b) NativeScript
c) react-navigation
d) jQuery Navigation

c) react-navigation ✅

Section 3: Angular & NgRx


11. Q11. What decorator is used to define a component in Angular?

a) @NgModule
b) @Injectable
c) @Component
d) @Directive

c) @Component ✅
12. Q12. What is the purpose of NgRx in Angular apps?

Explanation: NgRx is Angular’s Redux. It helps manage application state reactively using
Actions, Reducers, Effects.

13. Q13. Which file is typically used to define routes in Angular?

a) routes.json
b) app.routes.ts
c) app-routing.module.ts
d) router.config.js

c) app-routing.module.ts ✅

14. Q14. Write the syntax of a basic *ngIf usage.

Example: <div *ngIf="isLoggedIn">Welcome</div>

Section 4: State Management & API


15. Q15. In Redux, what is the function of a reducer?

Explanation: A pure function that returns new state based on current state and action.

16. Q16. Which of the following best describes a RESTful API?

a) A frontend layout manager


b) A tool for animations
c) A standard for building scalable web services
d) A JS pattern

c) A standard for building scalable web services ✅

17. Q17. What steps do you take to handle loading and error states in an API call?

Explanation: Use `loading` state, try/catch for error handling, show loader or error
messages.

Section 5: Responsive Design, Git, Agile


18. Q18. Which unit is relative to the root font size?

a) em
b) %
c) px
d) rem

d) rem ✅
19. Q19. Describe how you resolve a Git merge conflict.

Explanation: Open conflicted files, manually resolve, `git add`, then commit and push.

20. Q20. What activities are involved in a typical Agile sprint?

Explanation: Sprint planning, daily stand-ups, coding, sprint review, retrospective.

You might also like