Back to Subject

Unit 1: Refreshing JavaScript and ReactJS installation - Practice Quiz

INT252 — Web App Development With Reactjs 50 Questions
0 Correct 0 Wrong 50 Left
0/50

1 In ES6, which keyword is used to declare a variable that cannot be reassigned?

A. const
B. let
C. var
D. static

2 What is the scope of a variable declared using the 'let' keyword?

A. Block scope
B. Global scope
C. Module scope
D. Function scope

3 Which of the following is the correct syntax for an Arrow Function in ES6?

A. name() => {}
B. const name = () => {}
C. function name() {}
D. const name -> {}

4 How does the 'this' keyword behave differently in Arrow Functions compared to regular functions?

A. It has its own binding to 'this'
B. It inherits 'this' from the surrounding code (lexical scoping)
C. It always refers to the global object
D. It is undefined

5 Which Array method creates a new array by applying a function to every element in the calling array?

A. filter
B. reduce
C. forEach
D. map

6 What does the Array.prototype.filter() method return?

A. A boolean value
B. The modified original array
C. A new array with all elements that pass the test
D. The first element that matches the condition

7 Which method checks if all elements in an array pass a specific test?

A. every()
B. check()
C. some()
D. filter()

8 What is the primary purpose of the Array.prototype.reduce() method?

A. To filter the array
B. To loop through the array
C. To reduce the array to a single value
D. To reverse the array

9 Which ES6 feature allows you to unpack values from arrays or properties from objects into distinct variables?

A. Hoisting
B. Rest Operator
C. Spread Operator
D. Destructuring

10 What is the output of the following code: const [a, b] = [1, 2]; console.log(b);?

A. [1, 2]
B. 2
C. 1
D. undefined

11 Which operator is indicated by three dots (...) and expands an iterable into individual elements?

A. Rest Operator
B. Spread Operator
C. Dot Operator
D. Ternary Operator

12 In the context of function arguments, what does the Rest operator (...) do?

A. Returns the remainder of a division
B. Copies the object
C. Expands an array into arguments
D. Collects multiple arguments into a single array

13 How do you define a class in ES6?

A. type MyClass {}
B. define MyClass {}
C. class MyClass {}
D. function class MyClass() {}

14 Which keyword is used to inherit a class from another class?

A. inherits
B. extends
C. super
D. implements

15 What is the purpose of the 'export default' syntax in ES6 Modules?

A. To export a single main value from a module
B. To export multiple values
C. To delete a module
D. To import a module

16 How do you import a named export 'data' from a module 'file.js'?

A. import data from './file.js'
B. import { data } from './file.js'
C. require(data) from './file.js'
D. fetch data from './file.js'

17 Which method creates a new Array instance from an array-like or iterable object?

A. Array.create()
B. Array.of()
C. Array.from()
D. Array.new()

18 What does the Array.prototype.find() method return?

A. The first element satisfying the condition
B. True or False
C. A new array
D. The index of the element

19 The Array.prototype.concat() method is used to:

A. Filter the array
B. Remove the last element of an array
C. Merge two or more arrays
D. Sort the array

20 What is a Single Page Application (SPA)?

A. An app that dynamically rewrites the current web page with new data from the web server
B. An app that reloads the page on every click
C. A website that uses only one HTML tag
D. An application that runs offline only

21 What is a major difference between SPA and MPA (Multi-Page Application)?

A. MPA reloads the page for every request, SPA does not
B. SPA uses HTML, MPA does not
C. SPA is slower than MPA
D. There is no difference

22 Which company maintains ReactJS?

A. Twitter
B. Facebook (Meta)
C. Google
D. Microsoft

23 What is the standard command to create a new React project using Create React App?

A. npm install create-react-app
B. node create-react my-app
C. npm new react-app my-app
D. npx create-react-app my-app

24 Which build tool is known for being faster than Webpack and is often used as an alternative to Create React App?

A. Babel
B. Vite
C. Gulp
D. Grunt

25 Which folder in a React project structure typically contains images, index.html, and the manifest file?

A. build
B. src
C. node_modules
D. public

26 In a standard React folder structure, where does the source code (components, styles) primarily reside?

A. src
B. public
C. root
D. dist

27 What is 'node_modules' in a React environment?

A. Your custom components
B. The folder containing all installed npm dependencies
C. The folder for unit tests
D. The production build folder

28 What does JSX stand for?

A. Java Syntax Extension
B. JavaScript Xhtml
C. JSON Xchange
D. JavaScript XML

29 Can browsers understand JSX directly?

A. No, it must be transpiled to regular JavaScript
B. Yes, if the file extension is .jsx
C. Yes, all modern browsers support it
D. Only Chrome supports it

30 In React, what is the equivalent of the HTML 'class' attribute in JSX?

A. class
B. className
C. styleClass
D. cssClass

31 What method is strictly used to render a React element into the DOM in older React versions (before React 18)?

A. document.render()
B. ReactDOM.mount()
C. React.render()
D. ReactDOM.render()

32 Which function is implicitly called when you write JSX tags?

A. React.makeElement
B. document.createElement
C. React.createElement
D. React.compile

33 What are the first three arguments of React.createElement()?

A. type, props, children
B. type, children, props
C. props, type, children
D. children, type, props

34 How do you embed a JavaScript expression inside JSX?

A. Inside double quotes " "
B. Inside curly braces { }
C. Inside square brackets [ ]
D. Inside parentheses ( )

35 Which of the following is a valid way to write an inline style in JSX?

A. style={{ color: "red" }}
B. style={ "color": "red" }
C. style="color: red;"
D. style={color: "red"}

36 Component names in React must start with:

A. A lowercase letter
B. An underscore
C. A dollar sign
D. An uppercase letter

37 What is the main advantage of using JSX over React.createElement?

A. It runs faster
B. It provides a visual structure that is easier to read and write
C. It is standard HTML
D. It doesn't require JavaScript

38 If you want to render a list of items in React, which array method is most commonly used?

A. map
B. forEach
C. reduce
D. filter

39 What acts as the entry point to a React application created with Vite?

A. main.jsx
B. index.js
C. server.js
D. App.js

40 Which file typically contains the root DOM node <div id="root"></div>?

A. index.js
B. index.html
C. package.json
D. App.js

41 In React, tags with no children (self-closing tags) must end with:

A. />
B. </>
C. >
D. ?>

42 What is the correct way to wrap multiple elements in JSX without adding an extra node to the DOM?

A. <Section>
B. <div>
C. <Fragment> or <>
D. <React.Container>

43 What is the return type of a functional component?

A. String
B. Boolean
C. JSX
D. HTML

44 Which environment is required to run the 'create-react-app' command?

A. Node.js
B. JDK
C. Python
D. Apache

45 What is the purpose of package.json in a React project?

A. It stores the database configuration
B. It contains the HTML templates
C. It contains the React source code
D. It lists project dependencies and scripts

46 What does the Array.prototype.reverse() method do?

A. Filters out the last element
B. Creates a reversed copy
C. Reverses the order of elements in place
D. Sorts the array alphabetically

47 How do you comment inside JSX?

A. // comment
B. <!-- comment -->
C. {/ comment /}
D. # comment

48 What happens if you try to render a Boolean value (true/false) in JSX?

A. It renders 1 or 0
B. It renders 'true' or 'false' as text
C. It throws an error
D. It renders nothing

49 Which attribute is used in JSX to handle the 'for' attribute of labels?

A. labelFor
B. forLabel
C. for
D. htmlFor

50 The 'forEach' array method returns:

A. undefined
B. The modified array
C. A new array
D. The length of the array
Next MCQ
Unit 2