MAD Study Hub

Home / Past papers / MAD2 Quiz 2 / this paper

Modern Application Indian Institute Of Technology, Madras - Bs In Data Science And Applications Development Ii 14 Aug 26 - 16 Aug 2026

MAD2 Quiz 216 questions50 marks12 MCQ · 4 MSQ
Elapsed 00:00
Q1MCQ2 marks
A developer opens the Node.js REPL and runs the following line: question figure Why does this fail?
Text of the picture (copyable)
```javascript
const heading = document.querySelector("h1")
```
  1. Node.js cannot execute JavaScript from the terminal.
  2. The Node.js runtime does not provide browser DOM APIs like
    text
    document
  3. works only after using
    text
    ```javascript
    document.querySelector()
    ```
    ```
    setTimeout()
    ```
  4. V8 can execute only arithmetic expressions, not DOM code.
Q2MCQ2 marks
Consider the following javascript code: question figure The above code is initially loaded on the browser and then the browser is refreshed two times. What will be the final output?
Text of the picture (copyable)
```javascript
function addProduct(product) {
    let products = JSON.parse(localStorage.getItem('products')) || [];
    products.push(product);
    localStorage.setItem('products', JSON.stringify(products));
}

function getProducts() {
    return JSON.parse(localStorage.getItem('products')) || [];
}

addProduct({ id: 3, name: 'Tablet' }.name);
console.log(getProducts());
```
  1. ['Tablet', 'Tablet']
  2. ['Tablet', 'Tablet', 'Tablet']
  3. [{ id: 3, name: 'Tablet' }]
  4. [undefined]
Q3MCQ2 marks
Point out the error with the following code that is used to display user data? question figure
Text of the picture (copyable)
```javascript
async function getUser() {
  const response = await fetch("https://api.example.com/user/1");

  if (!response.ok) {
    throw new Error("Request failed");
  }

  const data = await response.json();
  console.log(data.name);
}

getUser();
```
  1. should use POST method by default, not GET
    text
    ```
    fetch()
    ```
  2. and will throw errors because response is a
    text
    response.ok
    ```
    response.json()
    ```
    Promise
  3. cannot be called on a response; use instead
    text
    ```
    .json()
    ```
    fetch
    ```
    .text()
    ```
  4. does not work inside functions
    text
    ```
    fetch()
    ```
    async
Q4MCQ3 marks
What is the correct output order for the following code? question figure
Text of the picture (copyable)
```javascript
console.log("A")
setTimeout(() => console.log("B"), 0)
Promise.resolve().then(() => console.log("C"))
console.log("D")
```
  1. A B C D
  2. C A D B
  3. A D C B
  4. A D B C
Q5MCQ3 marks
Consider the following code: question figure What happens to ?
Text of the picture (copyable)
```javascript
const settings = { theme: "light", layout: { sidebar: true } }
const copy = { ...settings }
copy.layout.sidebar = false
```
```
settings.layout.sidebar
```
  1. It remains because spread syntax always creates a deep copy.
    text
    true
  2. It becomes because the nested object is still shared in a shallow copy.
    text
    false
  3. It becomes because is removed from the original object.
    text
    undefined
    layout
  4. The code throws an error because nested objects cannot be copied with spread syntax.
Q6MCQ3 marks
Consider the following JavaScript code snippet? question figure What will be the output of above code on the browser’s console?
Text of the picture (copyable)
```javascript
async function fetchData() {
  console.log("1");
  const result = await new Promise((resolve) => {
    setTimeout(() => resolve("done"), 1000);
    console.log("2");
  });

  console.log("3:", result);
}

fetchData();
console.log("4");
```
  1. 1 → 2 → 3: done → 4
  2. 1 → 4 → 2 → 3: done
  3. 1 → 2 → 4 → 3: done
  4. 1 → 2 → 4 (3 never prints due to unresolved promise)
Q7MCQ3 marks
Consider the following Vuex store snippets. Which of the following demonstrates the correct usage of a mutation as per its definition?
  1. question figure
    text
    ```
    mutations: {
      ADD_TO_CART(state, product) {
        state.cart.push(product)
      }
    }
    ```
  2. question figure
    text
    ```javascript
    mutations: {
      ADD_TO_CART(state, product) {
        setTimeout(() => {
          state.cart.push(product)
        }, 500)
      }
    }
    ```
  3. question figure
    text
    ```javascript
    mutations: {
      ADD_TO_CART(state, product) {
        fetch('/api/add').then(() => {
          state.cart.push(product)
        })
      }
    }
    ```
  4. question figure
    text
    ```javascript
    mutations: {
      ADD_TO_CART(state, product) {
        Promise.resolve().then(() => {
          state.cart.push(product)
        })
      }
    }
    ```
Q8MSQ3 marksselect all that apply
Suppose the following HTML exists: question figure Which of the following statements are correct?
Text of the picture (copyable)
```html
<div class="card" data-price="499">
    <span id="title">Vue Book</span>
</div>
```
  1. returns .
    text
    ```javascript
    document.querySelector(".card").dataset.price
    ```
    "499"
  2. converts the value to numeric .
    text
    ```javascript
    Number(document.querySelector(".card").dataset.price)
    ```
    499
  3. can read the visible text .
    text
    ```javascript
    document.getElementById("title").innerText
    ```
    "Vue Book"
  4. returns a single element, not a collection.
    text
    ```javascript
    document.querySelectorAll(".card")
    ```
Q9MSQ3 marksselect all that apply
A Vue frontend, a mobile app, and another backend service all call the same Flask API deployed on multiple servers. The team chooses JWT authentication. Which of the following statements are correct?
  1. Each request can carry the token, so any server can validate it without storing a per-user session in memory.
  2. JWT is API-friendly because clients can send it using the header.
    text
    ```
    Authorization: Bearer <token>
    ```
  3. In Flask-JWT-Extended, can read the identity stored in the token.
    text
    ```
    get_jwt_identity()
    ```
  4. Session-based authentication is usually easier to scale across multiple servers because no shared storage is needed. The team should have chosen this.
Q10MSQ4.5 marksselect all that apply
A Vue 2 component does the following: •loads initial task data from an API, •starts a timer after the component appears on the page, •clears that timer before the component is removed. Which hook choices are appropriate?
  1. for loading initial data.
    text
    ```
    created()
    ```
  2. for starting DOM-related work or timers.
    text
    ```
    mounted()
    ```
  3. for cleanup.
    text
    ```
    beforeDestroy()
    ```
  4. for declaring reactive .
    text
    ```
    destroyed()
    ```
    data
Q11MSQ2 marksselect all that apply
In a Vue Router app, a developer uses: • inside a parent route, • , • inside a method. Which statements are correct?
Text of the picture (copyable)
children
```
{ path: '*', component: NotFound }
```
```javascript
this.$router.go(-1)
```
  1. can be used to organize nested routes under a parent route.
    text
    children
  2. can act as a fallback for unknown routes.
    text
    *
  3. tries to go back one step in browser history.
    text
    ```javascript
    this.$router.go(-1)
    ```
  4. Vue Router removes the need for route components.
Q12MCQ4.5 marks
Fill in Code1, inside a mutation handler, which can be used to reduce the price of each of the products in the state by a certain discount. app.js: question figure
Text of the picture (copyable)
```javascript
const store = new Vuex.Store({
  state: {
    discount: 10,
    products: [
      {name: 'apple',
        price: 120
      },
      {
        name: 'banana',
        price: 60
      }
    ]
  },
  mutations: {
    reducePrice: state=>{
      // Code1
    }
  }
})
```
  1. text
    ```javascript
    this.$store.state.products.forEach(product => { product.price -= (state.discount)/100*product.price; })
    ```
  2. text
    ```javascript
    state.products.forEach(product => { product.price -= (state.discount)/100*product.price;})
    ```
  3. text
    ```javascript
    commit.products.forEach(product => { product.price -= (state.discount)/100*product.price;})
    ```
  4. text
    ```javascript
    dispatch.products.forEach(product => { product.price -= (state.discount)/100*product.price;})
    ```
Q13MCQ4.5 marks
Consider the following Vuex store and component code. store.js question figure Component.vue question figure After triggering all three methods ( , and ) one by one, which of the following statements is correct?
Text of the picture (copyable)
```javascript
const store = new Vuex.Store({
  state: {
    cart: []
  },
  mutations: {
    ADD_TO_CART(state, product) {
      state.cart.push(product)
    }
  },
  actions: {
    addToCart({ commit }, product) {
      setTimeout(() => {
        commit('ADD_TO_CART', product)
      }, 500)
    }
  }
})
```
```javascript
methods: {
  addItem_A(product) {
    this.$store.commit('ADD_TO_CART', product)
  },
  addItem_B(product) {
    this.$store.dispatch('addToCart', product)
  },
  addItem_C(product) {
    this.$store.state.cart.push(product)
  }
}
```
addItem_A
addItem_B
addItem_C
  1. All three methods will update the cart and all changes will be visible in Vue DevTools mutation history.
  2. Only and will appear in Vue DevTools mutation history, but will appear with a delay.
    text
    addItem_A
    addItem_B
    addItem_B
  3. Only will update the cart because mutations cannot be called directly from components.
    text
    addItem_B
  4. will throw an error because Vuex prevents direct state modification.
    text
    addItem_C
Q14MCQ4.5 marks
Read the following component carefully. question figure What will be logged in the console when this component first loads?
Text of the picture (copyable)
```html
<template>
  <div>
    <p>{{ message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: ""
    };
  },
  beforeCreate() {
    console.log("A:", this.message);
  },
  created() {
    console.log("B:", this.message);
    this.message = "Hello from Vue!";
  },
  mounted() {
    console.log("C:", document.querySelector("p").textContent);
  }
};
</script>
```
  1. text
    A: "" → B: Hello from Vue! → C: Hello from Vue!
  2. text
    A: undefined -> B: Hello from Vue! -> C: Hello from Vue!
  3. text
    A: undefined → B: "" → C: Hello from Vue!
  4. text
    A: undefined → B: undefined → C: Hello from Vue!
  5. text
    A: "" -> B: "" -> C: Hello from Vue!
Comprehension passage - the questions below it refer to this
Read the following code carefully and answer the given sub questions: file1: router/index.js question figure file2: ProfileComponent.vue question figure
Q15MCQ3 marks
What should be filled in at Line A to correctly read the username from the URL?
  1. text
    ```
    this.$router.params.username
    ```
  2. text
    ```
    this.$route.params.username
    ```
  3. text
    ```
    this.$router.query.username
    ```
  4. text
    ```
    this.$route.query.username
    ```
Q16MCQ3 marks
What should be filled in at Line B to navigate to the Settings page?
  1. text
    ```
    { path: "Settings" }
    ```
  2. text
    ```json
    { path: "SettingsComponent" }
    ```
  3. text
    ```json
    { "name": "Settings" }
    ```
  4. text
    ```json
    { "name": "SettingsComponent" }
    ```

Answer key

  1. Q1 (MCQ, 2 marks): B
  2. Q2 (MCQ, 2 marks): B
  3. Q3 (MCQ, 2 marks): B
  4. Q4 (MCQ, 3 marks): C
  5. Q5 (MCQ, 3 marks): B
  6. Q6 (MCQ, 3 marks): C
  7. Q7 (MCQ, 3 marks): A
  8. Q8 (MSQ, 3 marks): A, B, C
  9. Q9 (MSQ, 3 marks): A, B, C
  10. Q10 (MSQ, 4.5 marks): A, B, C
  11. Q11 (MSQ, 2 marks): A, B, C
  12. Q12 (MCQ, 4.5 marks): B
  13. Q13 (MCQ, 4.5 marks): B
  14. Q14 (MCQ, 4.5 marks): C
  15. Q15 (MCQ, 3 marks): B
  16. Q16 (MCQ, 3 marks): C