CS 290 Final
Consider the following directory structures: The directory public contains a directory db and 2 files index.html and details.html The directory db contains a directory movies and a file topten.html The directory movies contains 2 files actors.html and directors.html Which of the following URLs in the file directors.html links to the file topten.html? ././topten.html /movies/db/topten.html ../topten.html ./db/topten.html
../topten.html
How is the general structure of an HTML document?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Basic Structure of an HTML Document</title> </head> <body> </body> </html>
How can we create links using the anchor element?
<a> is the anchor <a href="https://developer.mozilla.org/en-US/">A link to MDN.</a>
What are the different types of header elements?
<h1><h2>
How can we create tables in HTML?
<table> <caption>Characteristics with positive and negative sides</caption> <thead> <tr> <th>Characteristic</th> <th>Negative</th> <th>Positive</th> </tr> </thead> <tbody> <tr> <td>Mood</td> <td>Sad</td> <td>Happy</td> </tr> <tr> <td>Grade</td> <td>Failing</td> <td>Passing</td> </tr> </tbody> </table>
How can we create different types of lists in HTML?
<ul> <li>first item</li> <li>second item</li> <li>third item</li> </ul> <or> ordered list
What is npm?
A Package Manager for Node
What is a scheme?
A URL starts with a scheme which identifies the protocol the web client must use to request the resource. ie: http or https
What is a collection in MongoDB?
A collection is a grouping of MongoDB documents.
What are higher-order functions?
A function that either takes a function as an argument
How does JavaScript use prototypes to support objects without classes?
A prototype is a special object that collects properties common to multiple objects. Use to create objects with the same properties. const stockPrototype = { totalPrice: function (count) { return this.price * count; } }
What is the schema concept in Mongoose?
A schema represents the properties of a collection in MongoDB.
Which of the following are examples of a breach of confidentiality? A user is able to view a file they are not authorized to view A user is unable to log into a website because of a denial of service attack A user is able to delete a file they are not authorized to delete
A user is able to view a file they are not authorized to view
Which of the following are examples of scaling-up the infrastructure of a web app (select one or more) Adding more servers of the same size Adding more CPUs to a server Adding more memory to a server Reducing the size of messages sent by the web app
Adding more CPUs to a server Adding more memory to a server
How can we modify the DOM tree?
Adding nodes Creating nodes Inserting nodes Removing nodes
What is the difference between absolute and relative URLs?
An absolute URL is a complete URL to a resource including the protocol and the domain name. For example: The URL https://module3.cs290.com/index.html and https://module3.cs290.com/contacts.html are both absolute URLs. A relative URL points to a location relative to the file in which we use that URL. Same directory: We can specify a relative URL to a file in the same directory by using just the name of that file or by adding ./ before the name of the file. Using only the name of the file is the preferred syntax. For example: In the file index.html , the URLs contacts.html and ./contacts.html both refer to the file contacts.html located in the root directory. In the file list.html in the directory product , the URLs contacts.html and ./contacts.html both refer to the file contacts.html in the directory product .
What is the link element and how we can use to specify a relationship between a document and an external recourse?
Another use of URLs in HTML documents is using the link element (Links to an external site.) <link> to specify a relationship between a document and an external recourse. <link href="style.css" rel="stylesheet"/>
How can you chain promises?
By using multiple then methods.
What functionality does the controller layer perform?
Connects the view to the model.
What are database management systems (DBMSs)?
Database management system (DBMS) is the software used to manage databases.
What functionality does the view layer perform?
Displays data
What type of DBMS is MongoDB?
Document DBMSs
How do document DBMSs organize data?
Document-oriented DBMS, such as MongoDB, Amazon's DocumentDB, Couchbase, Google's Firestore, are comparatively new. Data is stored as a document in a format such as JSON or XML.
What is a document in MongoDB?
Documents contain data
How can we use Express and Node to write a web application to serve static HTML documents?
Express module provides a method static that we can use to serve static files. Public folder in the root directory.
What are function expressions?
Expressions that return a function // The first argument of myFilter is now an anonymous function defined using the arrow syntax result = myFilter(x => x % 2 === 0, numbers);const isEven = (x => x % 2 === 0); const isEven = function(x) { return x % 2 === 0;};
What are the different ways of adding styling rules an HTML document, and what are the pros and cons of these different ways?
External CSS using separate stylesheet. Internal CSS using the style element. Inline CSS using the style attribute of an element.
Because HTTP is stateless, there is no way for a web server to link multiple requests from the same user. True False
False
Consider a particular operation on a web app has a response time of less than 0.1 second. Should the web app provide information to the user about this delay? True False
False
Consider the following function: function getData(url) { return fetch(url) // line 1 .then(response => response.text()) // line 2 .then(data => addData(data)) // line 3 .catch(error => console.error(error)); // line 4 } If an exception occurs at line 3, it will be caught at line 4. However, an exception that occurs at line 2 will not be caught by line 4. True False
False
The Accept header is used in HTTP responses to specify the MIME type of the response body. True False
False
We can prevent the default action of an event from being executed by calling stopPropagation() True False
False
What is Express middleware and what are its uses?
Functions that execute during the lifecycle of a request to the Express server.
What is the GET method used for?
GET is used to request data from a specified resource. ie: an image
What is the form tag and its important attributes?
HTML forms enable web applications to collect information from the user.
What is meant by HTML elements?
HTML structures documents by using elements. ie: <p></p>
What is HTML and what is its use?
Hypertext Markup Language A markup language for describing documents that can be retrieved over the web.
What is HTTP and what is its use?
Hypertext Transfer Protocol protocol that describes how to exchange messages A program called the client can send a request (e.g., to retrieve a document) to Another program called the server which sends back a response (e.g., containing the requested document) back to the client.
How can we submit form data using GET and POST methods?
If we use GET, then the users will see the data as part of the URL, but the data is not displayed in the URL when using POST.
What is the primary use of HTML?
We one can navigate from one HTML document to another HTML document and a language to describe webpages.
What are promises?
We provide functions that will be executed when the promise settles.
What is a client?
Web browser Interprets the HTML in a document it receives in the HTTP response from the server and displays the document
What are exceptions and how should we use them in our programs?
When an error occurs in a function throw Error('Value is too big');
What is the value of arr2 after running the following code? let arr1 = [12, 8, 4, 24, 50];let arr2 = arr1.filter( x => x % 4 !== 0); [12, 8, 4, 24] [12, 8, 24, 50] [50] [4]
[50]
How can we add middleware using the app.METHOD API?
app.get("/", (req, res, next) => { res.send(`typeof next is ${typeof (next)}`); });
What is error-handling middleware and how does it differ from other middleware?
app.use((error, req, res, next) => { console.log(`Unhandled error ${error}. URL = ${req.originalUrl}, method = ${req.method}`); res.send('500 - Server Error'); });
What are the uses of the elements section, article and div.
div - divide content section - used to make a thematic grouping of content. article - Not only should the content all be related but the content should generally stand on its own as a composition.
Consider we declare p1, p2 and p3 as follows: const p1 = { name: 'Ron Burgundy'}; let p2 = { name: 'Ron Burgundy'}; const p3 = p2; What will be printed by the following three console.log statements (we have omitted the newlines in the answer choices) console.log(p1 === p2); console.log(p2 === p3); console.log(p1 === p3); false true true true true true false true false
false true false
How to write asynchronous JavaScript programs using promises?
function getData(url) { return fetch(url) fetch() returns a promise
What is the general form of a CSS rule?
h1 { color: red; font-size: 25pt; }
Match the CSS rule with the type of selector: CLass, ID, or Type Selector? h1 {color: red} .container {color: red} #container {color: red}
h1 {color: red}: Type Selector .container {color: red}: Class Selector #container {color: red}: ID Selector
Suppose we download an HTML page from the URL https://oregonstate.edu/eecsLinks to an external site. The body element of the page is shown below <body> <form method="POST"> <label>Name: <input type="text" name="name"> </label> <button type="submit">Submit</button> </form> </body> When a user clicks the submit button, what is the URL to which the HTTP request would be sent? None, because the form element is missing the action attribute https://oregonstate.edu/eecs/POST https://oregonstate.edu/eecs
https://oregonstate.edu/eecs
How to create objects with state and behavior?
let s1 = { company: 'Splunk', symbol: 'SPLK', price: '137.55' }; State: Each object has its own state which is in the properties, company, symbol, price. Behavior: Functions are first-class value in JavaScript. We can add behavior to an object by adding properties whose values are functions.
What are DOM events and how can we use them to create interactive web applications?
mouse related, keyboard related, focus related, form submission, input event
How can we create Node applications using npm?
o install and manage these packages for our Node applications, we will use npm
What is JavaScript and what is its use?
programming language for developing web applications Used for both client-side programs, i.e., programs that run in the web browser, and for server-side programs, i.e., programs that run in the Web Server to process HTTP requests received from the client and send back HTTP responses to the client.
What are the two ways of defining anonymous functions?
result = myFilter(x => x % 2 === 0, numbers);
What are the features provided by modern JavaScript to define classes and subclasses?
subclass inherits class properties
What are the properties of DOM nodes that are commonly modified?
textContent - all the text in the node innerHTML - HTML markup within the elemenet
How to write asynchronous JavaScript programs using the await and async keywords?
try { const response = await fetch(url); // line 1 const data = await response.text(); // line 2 addData(data); // line 3 } catch (error) { // line 4 console.error(error) // line 5 }
What is the input tag and how we can use it to create different types of input elements in our HTML documents?
type - how it is displayed and used name - how the server knows which part of the form each data item is associated with
What is Express.js?
web framework for node.js Express.js provides APIs for various common tasks that web applications need to do, e.g., handling requests, generating responses, serving out static files, etc.
What are attributes and how do we specify values of attributes?
In addition to basic opening and closing tags, additional information can be provided using attributes. ie: <input type="checkbox" checked> type="checkbox" checked are the attributes
What may be contained in a response body?
In our example, the body contains the complete HTML document, which a browser will display to the user.
What are the different states a promise can be in?
Initial state of this Promise object is pending meaning it does not yet have a result. When the asynchronous function successfully finishes, it fills in the Promise object with the result and sets its state to fulfilled. The promise is now said to have been fulfilled. The Promise is said to have resolved to this result value. When the asynchronous function fails due to an error, it will not produce a value. In this case, the state of the Promise object is set to rejected. Once the state of the Promise objects is set to either the fulfilled or rejected, it is said to have been settled.
How is rule precedence determined for CSS rules?
Later rules overrule earlier rules. Rules with a more specific selector take precedence over those with more general selectors. Rules associated with id override rules associated with class. Rules associated with class override rules associated with tags.
What functionality does the model layer perform?
Manages the application's data.
Name the definitions: Model View Controller
Model: Manages the application's data View: Display the data to the user Controller: Connects the 2 other layers
What is an ODM?
Mongoose Object-document mapper (ODM) that maps between classes and objects in our JavaScript code and the documents stored in MongoDB.
What are the different types of nodes that commonly occur in DOM trees for HTML documents?
One Parent Children Node with no children - leaf Nodes that are children of the same parent - leafs
What is meant by percent-encoding?
Percent-encoding, also known as URL encoding, is a method to encode arbitrary data in a Uniform Resource Identifier (URI) using only the limited US-ASCII characters legal within a URI.
Identify parts of the URL http://www.js.com:5000/a/b/c.html?year=2021 Protocol Server Name Port Path to resource Query parameter
Protocol: http Server Name: www.js.com Port: 5000 Path to resource: a/b/c.html Query Parameter: year=2021
How do relational DBMSs organize data?
Relational DBMS, such as Oracle, SQL Server, PostgreSQL, MySQL, etc., are the most common types of DBMS in current use. Organized using tables.
What is the use of response code?
Response status code, like 200 Indicates what is about to happen
What are the different methods we can use to search for elements in the DOM tree?
Search for elements based on their class, their id, or their type, or using CSS selectors.
What are pseudo-selectors?
Selector based on the state of an element. Common use cases for pseudo-classes are changing the style of an element when the mouse hovers over it, and displaying visited links differently from links that have not been visited.
What are CSS selectors and what are they used for?
Selects the HTML elements to which the rule applies. h1 is the selector
How do a client and a server communicate over the web?
The client is a web browser. A user enters a URL in the browser. The browser sends an HTTP request to the appropriate web server as identified by the URL. The server receives the HTTP request and determines the document that has been requested. The server sends back the document in an HTTP response to the browser. The browser interprets the HTML document and displays its contents.
How can you use the await keyword to wait for a promise to be settled?
The expression in line 1 uses await to wait for the promise to settle. If the promise is fulfilled, the response object returned by the fulfilled promise will be assigned to the variable response.
How is the concept of modules supported in JavaScript?
The idea is that developers writing a module can selectively make certain classes or functions available for use outside the module, while hiding the implementation details of those classes or functions inside the module.
What is meant by middleware pipeline?
The middleware functions with routes matching a request's URL are applied in the exact order of how they appear in the code of our Express app, thus setting up a pipeline of functions.
What is the Document Object Model, or DOM?
The model that a browser uses to render a web page.
Why can the await keyword only be used in an async function?
The reason is that we can only use await keyword in a function that is declared with the async keyword. Doing otherwise will result in a compilation error and JavaScript will reject our code. async function getData(url) { try { const response = await fetch(url); const data = await response.text(); addData(data); } catch (error) { console.error(error) } }
What are the different parts of an HTTP request? 4 parts
The request line: GET /index.html HTTP/1.1 Request headers: Accept: * / * A blank line An optional body: Since the HTTP method GET is used to retrieve a document, the body is empty for a GET request. When a client sends a POST request to send data to the server, the request body contains this data.
What is the use of the require function when using CommonJS modules?
The require() method is used to load and cache JavaScript modules.
What is a server?
The server receives the HTTP request and determines the document that has been requested. The server sends back the document in an HTTP response to the browser.
What is the use of response headers?
The status line is followed by response headers. Content-Type: text/html; charset=UTF-8
Consider the following module function createEntity(){ return 10;} export default function readEntity(){ return 5; } const STATE = 'TX'; export const COUNTRY = 'USA'; Which of the following statement are true? (choose one or more) The variable COUNTRY is a named export from this module. The variable COUNTRY is not exported from the module because the module already has a default export. Nothing is exported from the module because a module can either have default exports or named exports, whereas this module tries to have both named and default exports. The function readEntity() is the default export from this module.
The variable COUNTRY is a named export from this module. The function readEntity() is the default export from this module.
What is in the status line?
This is the first line in the HTTP request HTTP/1.1 200 OK Status-code is 200
What is the script element and its use?
To add JS to the HTML page or to reference a JS file to use
What are some types of basic CSS selectors?
Type: h1 ID: #vvip Class: .navigation <nav class="navigation"> This text will be in font-size 16pt because of the above rule. </nav>
How can we traverse elements in the DOM tree?
U the tree Down the tree Sideways in the tree
What is a URL and what is its use?
Uniform Resource Locator A naming infrastructure to represent documents, or more formally resources, located on the web. Web address
What are closures and how do we define them?
Used for information hiding return isDivisibleByX, isDivisible... is the closure
What is the need for CSS?
Used for styling HTML elements
What is the use of query parameters?
Used to provide additional information to the program to be executed for processing the request. ie: symbol=AMC&duration=6months
Consider the following code is executed: const y = (a, b) => { return a > b; }; function x(l, m, f){ return f(l, m) } let val1 = 10; let val2 = 12; let result = x(val1, val2, y); Which of the following statements is true? The definition of function y is invalid Value of result is true Value of result is false
Value of result is false
What are location-based CSS selectors?
We can specify selectors that select elements based on their location in the document
Relational DBMSs provide which language for CRUD operations on data?
Standard query language called SQL (Structured Query Language).
What is synchronous vs. asynchronous programming?
Synchronous: Each function runs to completion before any other code is executed in the program. asynch are non-blocking
