CompSci 290
Spring 2021
Web Application Development

Module 2 - Sample Quiz

Question 1

What error is present in the following JSON?

{
    "a": 'b' }
Check Answer

Single quoted strings are not allowed in JSON; all strings must be enclosed in double quotes.

 

Question 2

In the Debugger, what is the difference between Step In and Step Out?

Check Answer

Step In causes the debugger to move down into the function being called; Step Out causes the debugger to finish running the remaining code in the current function and go back up to the function that called it.

 

Question 3

Identify one problem with the following JavaScript function that will prevent it from returning the longitude/latitude coordinates as expected (assume the URL is correct and operating correctly).

function getLatestISSData () {
    let data = fetch('http://api.open-notify.org/iss-now.json');
    return data.iss_position;
}

For reference, ISS’s JSON format looks like the following:

{"message": "success", "timestamp": 1612871877, "iss_position": {"longitude": "98.8017", "latitude": "19.4053"}}
Check Answer

fetch() returns a Promise not the result directly. The function itself should be marked async and the keyword await added to the fetch() call to achieve desired effect. Also, there must be a call to json() on the result of fetch() to get an actual JSON object from the response string.

 

Question 4

Rewrite the following await-style code to use .then() (assume that getX() and getY() return Promises):

let x = await getX();
let y = await getY();
console.log(x + y);
Check Answer
getX().then(x => {
  getY().then(y => {
    console.log(x + y);
  })
});

 

Question 5

Complete the following JavaScript function so that await f(1, 2) === 3 and await f("a", "b") === "ab":

function f(x, y) {
    return new Promise((resolve, reject) => {
        // TODO: insert your code here
    });
}
Check Answer

Replace comment with: resolve(x + y);

 

Question 6

Which of the choices below is a possible output for the following JavaScript code fragment (only one answer)?

console.log("9");
let x = new Promise(r => {
    console.log("3");
    setTimeout(() => {
        console.log("5");
        r("4");
    }, 1000);
});
console.log("6");
x.then(y => console.log(y));
  1. 9 (newline) 3 (newline) 5 (newline) 4 (newline) 6
  2. 9 (newline) 3 (newline) 6 (newline) 5 (newline) 4
  3. 9 (newline) 6 (newline) 3 (newline) 5 (newline) 4
Check Answer
9
3
6
5
4

 

Question 7

Write JavaScript code that replaces the innerHTML of an HTML <ul> element with id='friends' with a bulleted list of friends and their ages based on retrieving data from https://notarealwebsite.duke.edu/myfriends.json. You can assume your code will be run within a function marked async.

Example JSON:

{
    "friends": [
        { "name": "Johnny", "age": 35 },
        { "name": "Mary", "age": 25 }
    ]
}
Check Answer
let result = await fetch('https://notarealwebsite.duke.edu/myfriends.json');
let data = await result.json();
document.getElementById('friends').innerHTML = data.friends.map(f => 
  `<li>${f.name} (age ${f.age})</li>`
).join('\n');

 

Question 8

What is the purpose of a Promise in JavaScript?

Check Answer

Promises are asynchronous features in JavaScript that allow a program to start a time-consuming task, such as a download, without being blocked waiting for that task to finish and without needing to pass callback(s) to be called in a different setting than the current function.

 

Question 9

Use map and filter to complete the following JavaScript function definition, which takes an array of numbers, squares them, and returns only those squares that round to a two digit number.

function twoDigitSquares (numbers) {
    return /* TODO: insert your code here */;
}
Check Answer

Replace comment with numbers.map(x => x * x).filter(x => String(Math.round(x)).length === 2)

 

Question 10

Write a JavaScript expression that obtains the number of whole degrees longitude for "united_states" from the JSON data provided by a variable named countryData. Assume countryData has the following structure:

{ 
  "united_states": {
    "data": {
      "name": "United States",
      "geography": {
        "location": "North America, bordering both the North Atlantic Ocean and the North Pacific Ocean, between Canada and Mexico",
        "geographic_coordinates": {
          "latitude": {
            "degrees": 38,
            "minutes": 0,
            "hemisphere": "N"
          },
          "longitude": {
            "degrees": 97,
            "minutes": 0,
            "hemisphere": "W"
          }
        },
      }
    }
  }
}
Check Answer

countryData.united_states.data.geography.geographic_coordinates.longitude.degrees

 

Question 11

Identify these components of the following URL: protocol, host, port, path, query, and fragment.

https://notarealwebsite.duke.edu:443/a/b/c?d=e#important_part

Check Answer

protocol: https
host: notarealwebsite.duke.edu
port: 443
path: /a/b/c
query: d=e
fragment: important_part

 

Question 12

Explain how changing the order of the code in the orderWordCounts() function to the following would affect which words were displayed in the Tag Cloud.

    wordCountList.sort((a, b) => a.word.localeCompare(b.word));
    wordCountList = wordCountList.splice(0, numWordsToDisplay);
    wordCountList.sort((a, b) => b.count - a.count);
Check Answer

The Tag Cloud would show only words starting with the first letters of the alphabet, no matter how many times they appeared in the text.