JavaScript Basics Unit

This unit was created by David Buckley for his classes at Merit Academy (Springville, UT).

Standards used in the scope and sequence are from the Computer Programming 1 Strands and Standards from the State of Utah. Standards 2.3, 3.1, 3.2, 4.1, and 4.2 are covered in their entirety.

Contact Mr. Buckley: david.buckley@meritacademy.org

Scope and Sequence

1. Introduction: Variables and Functions

Standards

2.3 - Identify the components of a programming language syntax.
  • Understand keywords, identifiers, operators, and operands.
  • Understand statements and expressions in a program.
  • Understand program components such as functions, methods, or procedures.
3.1 - Employ basic use of elements and data types of a programming language.
  • Declare, initialize, and assign values to constants and variables.
3.2 - Employ basic arithmetic expressions.
  • Use basic arithmetic operators (modulus, multiplication, division, addition, subtraction).
  • Understand order of operation of expressions.

Concepts

  • Declaring variables in JavaScript with let and const.
  • Declaring and calling functions in JavaScript.
    • Parameters
    • Return values
  • Basic math operators in JavaScript.

2. Data Types

Standards

3.1 - Employ basic use of elements and data types of a programming language.
  • Declare and use variable types (primitives, reference, or object).
  • Identify proper data types for a specified application (boolean, integer, floatingpoint, strings).

Concepts

  • number, string, and object data types.
  • How to use the . operator to access object properties.
  • Object terminology: instance, field, method.

3. The document and window Objects

Concepts

  • The Document Object Model (DOM).
  • Using document.querySelector() to select elements.
  • Using element.innerHTML, element.innerText, and element.setAttribute() to modify elements in the DOM.
  • Using the window object to get information about the viewport.

Quiz 1-3

At this point, I have students do a Kahoot related to projects 1-3.

4. Logic and Control Flow

Standards

3.1 - Employ basic use of elements and data types of a programming language.
  • Demonstrate the ability to use input and output commands.
4.1 - Demonstrate the ability to use relational and logical operators in programs.
  • Commpare values using relational operators (<, >, ==, <=, >=, etc.)
  • Form complex expressions using logical operators.
4.2 - Demonstrate the ability to use decisions in programs.
  • Employ simple IF structures.
  • Use IF-ELSE and nested IF-ELSE structures.

Concepts

  • Use window.alert() and window.prompt() for input/output.
  • Use conditional statements and boolean expressions for branching.

5. Events

Concepts

  • Use element.addEventListener() to bind functions to events.

6. String, Number, and Array Methods

Standards

3.2 - Employ basic arithmetic expressions.
  • Write expressions that mix floating-point and integer expressions.

Concepts

  • Use string and number methods to manipulate and format data.
  • Use arrays and array methods to manipulate collections from the DOM.

Quiz 2

At this point, I have students do a Kahoot related to projects 4-6.

Unit Project - To Do App

Assesses the students’ ability to synthesize the above concepts and develop a program themselves.