Scribd
Upload
2 views

Front end Test

The document is a technical interview evaluation form that includes multiple choice questions and scenario-based questions related to web development technologies such as HTML, CSS, JavaScript, React, Vue.js, and Angular. It assesses candidates' knowledge on topics like metadata in HTML, CSS properties, JavaScript functions, and performance optimization techniques. The form also provides space for interviewers to record scores and comments on the candidate's performance.

Uploaded by

muhdsaleh040
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
2 views

Front end Test

The document is a technical interview evaluation form that includes multiple choice questions and scenario-based questions related to web development technologies such as HTML, CSS, JavaScript, React, Vue.js, and Angular. It assesses candidates' knowledge on topics like metadata in HTML, CSS properties, JavaScript functions, and performance optimization techniques. The form also provides space for interviewers to record scores and comments on the candidate's performance.

Uploaded by

muhdsaleh040
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 3

Name: ______________________ Position: _________________

Technical Interviewer: _____________ HR Interviewer: ___________

Total Score: ______________ Obtained: ______________

Multiple Choice Questions:


1. What is the purpose of the <meta> tag in HTML?
A) To display content inside the body
B) To include external stylesheets
C) To define metadata like the character set and viewport settings
D) To link JavaScript files
2. Which CSS property is used to change the background color of an element?
A) background-color
B) color
C) font-color
D) text-color
3. What does the display: flex; property do in CSS?
A) Centers all child elements
B) Creates a flexible layout where elements can be arranged dynamically
C) Adds spacing between elements
D) Aligns the text inside an element
4. What is the correct way to add an external JavaScript file to an HTML document?
A) <script src="file.js">
B) <script href="file.js">
C) <js src="file.js">
D) <javascript src="file.js">
5. In JavaScript, which of the following is used to declare a constant variable?
A) let
B) var
C) const
D) final
6. Which of the following is the correct way to declare a function in JavaScript?
A) function = myFunction() {}
B) function myFunction() {}
C) def myFunction() {}
D) function: myFunction()
7. In React, what does JSX stand for?
A) JavaScript XML
B) JavaScript Extension

+92 321 axiomworld.n [email protected]


C) JavaScript Object
D) JavaScript and XML
8. How do you pass data from a parent component to a child component in React?
A) Using props
B) Using states
C) Using useRef hook
D) Using hooks
9. What is the primary use of the useState hook in React?
A) To add CSS styles to elements
B) To manage local component state
C) To handle side effects in functional components
D) To store the component reference
10. Which method is used to modify the DOM directly in React?
A) setDOM()
B) document.querySelector()
C) ReactDOM.render()
D) addElement()
11. In Vue.js, what keyword is used to bind a data property to an element's attribute?
A) v-bind
B) data-bind
C) bind
D) v-data
12. In Angular, which of the following is used to define a component?
A) @Component
B) @Injectable
C) @Directive
D) @NgModule
13. What is the purpose of ngIf in Angular?
A) It conditionally displays an HTML element based on a boolean value
B) It iterates over an array
C) It defines a directive for custom components
D) It imports an external module
14. What does the box-sizing: border-box; property in CSS do?
A) Changes the width and height calculation to include padding and borders
B) Removes padding from elements
C) Adds borders to an element
D) Resizes the box to fit the content
15. In JavaScript, which of the following will correctly return the length of an array?
A) array.size()
B) array.length()
C) array.length

+92 321 axiomworld.n [email protected]


D) array.getSize()
16. How do you prevent the default behavior of an event in JavaScript?
A) event.preventDefault()
B) event.stopPropagation()
C) event.cancel()
D) event.stop()
17. What is the purpose of localStorage in JavaScript?
A) To store data that persists across page reloads and sessions
B) To store data only during the current session
C) To store data on the server
D) To store files on the client
18. Which of the following is a valid HTML5 input type for accepting dates?
A) <input type="date">
B) <input type="calendar">
C) <input type="datetime">
D) <input type="time">
19. Which of the following is used to style elements in Angular applications?
A) styleUrls
B) stylesheets
C) CSS
D) styleSheetUrls

Scenario-Based Questions:

Scenario 1: You are developing a single-page application using React, and your team wants to
implement a feature where users can increase or decrease a counter. The counter should update
when user click plus button and decreases when user clicks minus button. How would you
implement this feature using React hooks and state management? Provide a brief explanation and
a sample code snippet.

Scenario 2: A web page you are working on has performance issues. Users report slow
rendering times and unresponsive UI, especially when handling a list with thousands of items.
What steps would you take to optimize and debug the issues using Chrome Dev tools. Mention
the specific tabs of Chrome wherein you will be most interested. Additionally, how would
implement memoization to improve performance.

+92 321 axiomworld.n [email protected]

You might also like