Exam 02: Preparation

This exam will be on paper, and must be taken in-person.
Categories:

  4 minute read  

Learning Objectives

Forms

  • 5.3 - Introducing Forms
  • 5.4 - Form Control Elements
  • 5.5 Table and Form Accessibility
  • 5.6 Styling and Designing Forms
  • 5.7 Validating User Input
  • 9.5 Forms in JavaScript

Source Control

  1. git basics
  2. git branching

JavaScript Fundamentals (review)

  • Identify and distinguish JavaScript data types (number, string, boolean, array, object)
  • Evaluate equality tests using both == and ===
  • Use basic control structures for conditions and loops
    • Know when to use for (const x in o) vs. for (const x of o)
  • Evaluate the result of an operation that uses type coercion (string/number concatenation)
  • Use built-in functions (splice(), slice(), pop(), shift(), push(), unshift()) to access and modify arrays
  • Use built-in functions (charAt(), split(), substring()) to access and modify strings

DOM Manipulation and Events

  • Access HTML elements with DOM methods
    • Example: let it = document.querySelector('#item');
    • Example: let it = getElementById('item');
  • Use DOM methods to create new HTML elements
    • Example: let newItem = document.createElement('li');
  • Access and modify fields within an object
    • Example: console.log(obj.x + obj['x']);
  • Set HTML element attributes using DOM dot notation
    • Example: a.href = 'other.html';
    • Example: a.attributes['data-bs-toggle'].value = 'collapse';
  • Modify an object’s classList using add, remove, and toggle
    • Example: img.classList.add('py-0', 'm-0');
  • Redirect a window to a separate page
    • Example: location.href = 'other.html';
  • Use DOM methods to add or remove children from an HTML node
    • Example: list.append(newItem);
  • Add a click event listener to an HTML element
    • Example: button.addEventListener('click', () => alert('clicked'));
  • Explain the behavior of preventDefault() and stopPropagation() on events
  • Determine the target of an event, such as a click
  • Evaluate the effect of event listeners defined for the capture, target, and bubbling phases of propagation

Functional and Asynchronous Programming

  • Create named functions that take parameters and return a value
  • Declare and determine the values of variables based on scope (lexical vs. global)
    • Use both let and const as appropriate
    • Understand why var is not advised for variable declaration
  • Create a variable that stores a function defined using anonymous syntax
    • Example: let f = function(x) { return x + 1; }
  • Distinguish function definition from immediate execution
    • Example: f from above vs. let g = (function(x) { return x + 1; })(5);
  • Create self-executing anonymous functions (typically for initialization)
    • Example: (function() { ... })();
  • Create and predict the behavior of arrow functions with and without optional syntax
    • Example: let x = (s) => { return 'hello ' + s; };
    • Example (omitting optional syntax): let x = s => 'hello ' + s;
  • Create and use object functions
    • Use the this keyword to access the object
    • Understand when the this keyword is bound to an object and when it is not
  • Pass a callback function as an argument to another function
    • Using either a function name, anonymous function, or arrow function
    • Example: doSomething(x => x.length);
  • Create and predict the behavior of a function that returns a closure
    • Example: function foo(x) { return function(y) { return x + y; }; }
    • Example: function foo(x) { return y => x + y; }
  • Use .forEach(), .map(), .find(), .filter(), and .reduce() on arrays
    • Example: list.forEach(it => console.log(it));
    • list.filter(it => it % 2 == 0).map(it => console.log(it + ' is even'));
  • Use fetch to retrieve data from a JSON file for processing
    • Example: fetch(data).then(resp => resp.json()).then(x => console.log(x));
  • Create and use functions declared as asynchronous
    • Example: async function foo() { ... }
  • Create and use functions that return a Promise
    • Example: function foo() { return new Promise(resolve => resolve(...); }

Study Resources

Textbook Reading

The exam is basically about Chapters 7–10, except for the sections we haven’t seen yet (9.5–9.6, 10.2, 10.4). Here are the reading assignments from Preps 7–9:

  • 7.2 - Flexbox Layout
  • 7.3 - Grid Layout
  • 7.4 - Responsive Design
  • 8.8 Functions
  • 8.9 Scope and Closure
  • 9.3 Events
  • 9.4 Event Types
  • 10.1 Array Functions

Preps and Labs

Live Editor Exercises

  • Live Editor
  • Exam 1 Review: JS 1–4, 9
  • Exam 2: JS 5–8, 10–12, 16

Alternative Readings

Last modified October 15, 2025: updates from brief sync-up (91b2c39)