MAD 2 End Term: 1 September 2024 (May 2024 term)

1function parent() {
2    var a = 1;
3    function child() {
4        console.log(a);
5    }
6    a = 2;
7    return child;
8}
9
10var closure = parent();
11closure();

1// Code Snippet 1
2sessionStorage.setItem('username', 'course_user');
3let storedUsername = sessionStorage.getItem('username');
4
5// Code Snippet 2
6sessionStorage.removeItem('username');
7let removedUsername = sessionStorage.getItem('username');
8
9// Code Snippet 3
10sessionStorage.clear();
11let clearedStorage = sessionStorage.username;

1const obj = {
2    num: 40,
3    regularFunction: function() {
4        return this.value;
5    },
6    arrowFunction: () => {
7        return this.value;
8    }
9};
10
11const regularResult = obj.regularFunction();
12const arrowResult = obj.arrowFunction();

1<script>
2    setInterval(() => document.title = "Title A", 2000)
3    setInterval(() => document.title = "Title B", 1000)
4</script>

1<script>
2    setInterval(() => document.title = "Title A", 1000)
3    setInterval(() => document.title = "Title B", 2000)
4</script>

1<script>
2      for (var i = 0; i <= 3; i++) {
3           setTimeout(() => console.log(i), (i+1)*1500);
4      }
5</script>

1<div id="app">
2    <input v-model="newItem" placeholder="Add an item" />
3    <button @click="addItem">Add</button>
4
5    <ul>
6        <li v-for="(item, index) in items" :key="index">
7            {{ index + 1 }}. {{ item }}
8        </li>
9    </ul>
10</div>
11
12<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
13<script>
14    new Vue({
15        el: '#app',
16        data: {
17            newItem: '',
18            items: ['Apple', 'Banana']
19        },
20        methods: {
21            addItem() {
22                if (this.newItem) {
23                    this.items.push(this.newItem, this.newItem);
24                    this.newItem = '';
25                }
26            }
27        }
28    });
29</script>

1localStorage.setItem('counter', '0');
2sessionStorage.setItem('total', '5');
3
4for (let i = 0; i < 3; i++) {
5    let counter = localStorage.getItem('counter');
6    let total = sessionStorage.getItem('total');
7
8    counter += 2;
9    total *= 2;
10
11    localStorage.setItem('counter', counter);
12    sessionStorage.setItem('total', total);
13}
14
15sessionStorage.clear();
16
17
18console.log(localStorage.getItem('counter'));
19console.log(sessionStorage.getItem('total'));

1class Animal {
2    constructor(name) {
3        this.name = name;
4    }
5
6    speak() {
7        console.log(`${this.name} makes a noise.`);
8    }
9}
10
11class Dog extends Animal {
12    speak() {
13        console.log(`${this.name} barks`);
14    }
15}
16
17const d = new Dog('Rex');
18d.speak();
19console.log(d.__proto__ === Dog.prototype);
20console.log(d.__proto__.__proto__ === Animal.prototype);

1from flask import Flask
2from flask_caching import Cache
3from time import sleep
4
5config = {
6    "CACHE_TYPE": "SimpleCache",
7    "CACHE_DEFAULT_TIMEOUT": 180
8}
9
10app = Flask(__name__)
11app.config.from_mapping(config)
12cache = Cache(app)
13
14@cache.memoize(timeout=180)
15def get_data(param):
16    sleep(5)
17    return f"Data for {param}"
18
19@app.route('/data/<param>')
20def data(param):
21    result = get_data(param)
22    return f"Result: {result}"
23
24if __name__ == '__main__':
25    app.run(debug=True)

1new Promise((resolve, reject) => {
2    const num = 0.6;
3    if (num > 0.5) {
4        resolve(num);
5    } else {
6        reject(num);
7    }
8})
9.then(data => {
10    console.log("Step 1:", data);
11    if (data > 0.75) {
12        return data * 2;
13    } else {
14        return Promise.reject(new Error("Less than 0.75"));
15    }
16})
17.then(data => {
18    console.log("Step 2:", data);
19    return data + 5;
20})
21.catch(error => {
22    console.log("Step 3:", error.message);
23    if (error.message === "Less than 0.75") {
24        return 1;
25    } else {
26        throw error;
27    }

1})
2 .then(data => {
3     console.log("Step 4:", data);
4     if (data === 1) {
5         throw new Error("Fallback value");
6     } else {
7         return data * 3;
8     }
9})
10 .catch(error => {
11     console.log("Step 5:", error.message);
12     return "Error handled";
13
14})
15.finally(() => {
16    console.log("Step 6: Finally block executed");
17})

1import Vue from 'vue';
2import Vuex from 'vuex';
3
4Vue.use(Vuex);
5
6export default new Vuex.Store({
7  state: {
8    value: " ",
9  },
10  mutations: {
11    setValue(state, payload) {
12      state.value = payload;
13    }
14  },
15  actions: {
16    async fetchValue({ commit }) {
17      // Simulate async API call
18      const response = await new Promise(resolve => setTimeout(() =>
19resolve('API Value'), 500));
20      commit('setValue', response);
21    }
22  }
23});

1<template>
2  <div>
3    <p>{{ value }}</p>
4    <button @click="updateValue">Update Value</button>
5  </div>
6</template>
7
8<script>
9export default {
10  computed: {
11    value() {
12      return this.$store.state.value;
13    }
14  },
15  methods: {
16    async updateValue() {
17      await this.$store.dispatch('fetchValue');
18    }
19  }
20}
21</script>

1async function newFetch(url) {
2  try {
3    console.log(url)
4    const res = await fetch(url)
5    if (!res.ok) {
6      throw new Error(`HTTP Error: ${res.status}`)
7    }
8    try {
9      const data = await res.json()
10      console.log(data)
11    } catch {
12      throw new Error('Error')
13    }
14  } catch {
15    throw new Error('Data is not JSON serializable')
16  }
17}
18newFetch('https://example.com/api/users/23').catch((err) => {
19  console.error(err)
20})

1from flask import Flask, jsonify
2from flask_caching import Cache
3
4app = Flask(__name__)
5app.config['CACHE_TYPE'] = 'redis'
6app.config['CACHE_REDIS_HOST'] = 'localhost'
7app.config['CACHE_REDIS_PORT'] = 6379
8cache = Cache(app)
9
10def compute_value(x, y):
11    result = x * y
12    return result
13
14@app.route('/compute/<int:x>/<int:y>')
15@cache.cached(timeout=60, key_prefix='compute')
16def compute(x,y):
17    result = compute_value(x, y)
18    return jsonify({'result': result})
19
20if __name__ == '__main__':
21    app.run(debug=True, port=5000)

1import requests
2
3response = requests.get('https://some-api')
4print(response.json())

1from flask import Flask, request
2
3app = Flask(__name__)
4
5@app.route('/server-route, methods=['POST'])
6def server_route():
7    data = request.json
8    print(data)
9    return 'OK', 200

1from flask import Flask, Response
2import time
3
4app = Flask(__name__)
5
6def stream():
7    while True:
8        time.sleep(5)
9        yield f'data: The time is {time.strftime("%Y-%m-%d %H:%M:%S")}\n\n'
10
11@app.route('/server-route')
12def server_route():
13    return Response(stream(), mimetype='text/event-stream')
14
15if __name__ == '__main__':
16    app.run(debug=True, port=5000)

1import time
2import requests
3
4while True:
5    response = requests.get('https://some-endpoint')
6    print(response.json())
7    time.sleep(10)

1import requests
2
3response = requests.get('https://some-api')
4print(response.json())

1from flask import Flask, request
2
3app = Flask(__name__)
4
5@app.route('/server-route, methods=['POST'])
6def server_route():
7    data = request.json
8    print(data)
9    return 'OK', 200

1from flask import Flask, Response
2import time
3
4app = Flask(__name__)
5
6def stream():
7    while True:
8        time.sleep(5)
9        yield f'data: The time is {time.strftime("%Y-%m-%d %H:%M:%S")}\n\n'
10
11@app.route('/server-route')
12def server_route():
13    return Response(stream(), mimetype='text/event-stream')
14
15if __name__ == '__main__':
16    app.run(debug=True, port=5000)

1import time
2import requests
3
4while True:
5    response = requests.get('https://some-endpoint')
6    print(response.json())
7    time.sleep(10)

1const Error = {template: `<div>Page Not Found</div>`}
2const Profile = {
3    template: `<div>
4                <div v-if='user'>
5                    Name: {{user.name}}, State: {{user.state}}
6                </div>
7                <div v-else>
8                    Unknown User
9                </div>
10             </div>`,
11    data() {
12        return {
13            profiles: [
14                { id: '1234', name: 'Animesh', state: 'MP' },
15                { id: '1235', name: 'Arnav', state: 'Goa' },
16            ],
17        }
18    },
19    computed: {
20        user(){
21            let user = this.profiles.find((profile) => {
22            return profile.id == this.$route.params.id
23            })
24            return user
25        },

1    computed: {
2        user(){
3            let user = this.profiles.find((profile) => {
4            return profile.id == this.$route.params.id
5            })
6            return user
7        },
8    },
9}
10
11
12const routes = [
13  { path: '/profile/:id', component: Profile },
14  { path: '*', component: Error },
15]
16
17const router = new VueRouter({
18  routes,
19})
20
21new Vue({
22  el: '#app',
23  router,
24})

1const Error = {template: `<div>Page Not Found</div>`}
2const Profile = {
3    template: `<div>
4                <div v-if='user'>
5                    Name: {{user.name}}, State: {{user.state}}
6                </div>
7                <div v-else>
8                    Unknown User
9                </div>
10             </div>`,
11    data() {
12        return {
13            profiles: [
14                { id: '1234', name: 'Animesh', state: 'MP' },
15                { id: '1235', name: 'Arnav', state: 'Goa' },
16            ],
17        }
18    },
19    computed: {
20        user(){
21            let user = this.profiles.find((profile) => {
22            return profile.id == this.$route.params.id
23            })
24            return user
25        },

1    computed: {
2        user(){
3            let user = this.profiles.find((profile) => {
4            return profile.id == this.$route.params.id
5            })
6            return user
7        },
8    },
9}
10
11
12const routes = [
13  { path: '/profile/:id', component: Profile },
14  { path: '*', component: Error },
15]
16
17const router = new VueRouter({
18  routes,
19})
20
21new Vue({
22  el: '#app',
23  router,
24})