🎨
[JS] Intro to Computational Media 2.0
CS4All Resources
  • Curriculum Overview
  • How to Use this Curriculum
  • 📬Leave Us Feedback
  • Curriculum Extras
    • 🔮Curriculum Extras Overview
    • Imposter Syndrome (pt. 1)
      • Imposter Syndrome (pt. 2)
    • Timers in p5.js
    • Time Functions: Crazy Clock Mini Project
    • Using Sliders
    • Pathfinding Algorithms && Facial Scanning
    • Playing with Pixels
    • Getting Sound from Mic
    • Sound Recognition with ml5
  • Unit 1: Draw & Draw With Functions
    • 🔮Unit 1 Overview
    • U1LA1.1: p5.js Introduction & Deconstruction
    • U1LA1.2 Line Functions and Parameters
    • U1LA1.3: Rectangles, Ellipses, and Layering
    • U1LA1.4: Other Shapes && Styling
    • 🗃️U1LA1 Mini Project: Taijitu Symbol
    • U1LA2.1: Intro to Color with RGB && HSB
    • 🤓EXTRA: Color & Data Storage
    • 🤓EXTRA: Color Palette Practice
    • ✨U1LA3.1: Introducing Variables
    • ✨U1LA3.2: Creating Custom Variables
    • ✨U1LA4.1: What is Abstraction?
    • ✨U1LA4.2: Intro to Functions && Function Calls
    • U1LA4.3: Draw with Functions
    • U1LA4.4: Using the Random Function
    • 🗃️U1LA4 Mini Project: Custom Emoji
    • U1LA5.1: Your Custom Function Library
    • 🎨Unit 1 Final Project: Abstract Album Art
  • Unit 2: Respond and Draw on Canvas
    • 🔮Unit 2 Overview
    • ✨U2LA1.1: Conditionals and If Statements
    • ✨U2LA1.2: Conditionals and if, else if, and else statements
    • ✨U2LA1.3: Logical Operators And/Or
    • 🗃️U2LA1 Mini Project: Make a Traffic Light
    • U2LA2.1: Draw with Mouse
    • U2LA2.2: The Map Function
    • ✨U2LA3.1: Data Type Scavenger Hunt
    • ✨U2LA3.2: Functions that Return Values
    • 🤓U2LA3.3: Functions with Purpose
    • U2LA4.1: Collision Functions && Collide2D
    • U2LA4.2: Mouse Clicks && Shapes as Buttons
    • 🗃️U2LA2 Mini Project: Light Switch Game
    • U2LA5.1: Key Presses && Nested Conditionals
    • 🎨Unit 2 Final Project: Interactive Drawing App
  • Unit 3: Arrays, Loops, Media
    • 🔮Unit 3 Overview
    • U3LA1.1: While Loops
    • U3LA1.2: For Loops Pt 1
    • U3LA1.3: Nested For Loops (For Loops pt 2)
    • 🗃️U3LA1 Mini Project: Wallpaper Design
    • U3LA2.1: Introduction to Arrays
    • U3LA.2.2: Arrays with floor() and random()
    • 🗃️U3LA2 Mini Project 1: Fortune Teller
    • U3LA2.3: Loops and Arrays
    • U3LA2.4: Updating and Deleting from Arrays
    • 🗃️🤓 U3LA2 Mini Project 2: CodeWars Array Challenges
    • U3LA3.1: Preload, Images, Tint
    • 🤓U3LA3.2: Images and Arrays with ml5
    • U3LA3.3: Fonts && Text Styling
    • 🗃️U3LA4 Mini Project 4: Typography
    • U3LA4.1: Loading & Playing Sound Files
    • 🎨Unit 3 Final Project: Patatap
  • Unit 4: Motion, Objects, Transformation
    • 🔮Unit 4 Overview
    • U4LA1.1: Intro to Motion with Flipbooks
    • U4LA1.2: Move in All Directions && Make it Bounce
    • U4LA2.1: Introduction to Classes and Objects
    • U4LA2.2: Reading and Updating Object Properties
    • U4LA2.3: Methods Off Canvas
    • U4LA2.4: Objects on Canvas
    • 🗃️U4LA2 Mini Project: Build a Tamagotchi
    • U4LA3.1: Creating Many Objects
    • 🤓🗃 Optional U4LA3 Mini Project: Rebuild with Objects
    • U4LA4.1: Translation Battleship
    • U4LA4.2: Rotations
    • 🤓U4LA5.1: Sine && Oscillating Motion
    • 🤓U4LA5.2: Cosine && Circular Motion
    • 🎨Unit 4 Final Project: Animated Greeting Card || PSA
  • Unit 5: Final Project
    • 🔮Unit 5 Overview
    • 🎨Course Final Project Guide
Powered by GitBook
On this page
  • Teacher Notes && Overview
  • Objectives
  • Suggested Duration
  • NYS Standards
  • Vocabulary
  • Planning Notes && Materials
  • Resources
  • Assessments
  • Do Now/Warm Up (2-3 Minutes)
  • Function Calls, Arguments, and Parameters Mini Lesson (~10 min)
  • Function Call Practice Worksheet (10 - 15 min)
  • Return & Review (~10 min)
  • Wrap-Up (3 - 5 min)
  • Extensions
  1. Unit 1: Draw & Draw With Functions

U1LA4.2: Intro to Functions && Function Calls

What do functions look like in code?

Teacher Notes && Overview

NB: This lesson technically covers NYS Standard 7-8.CT.4 Write a program using functions or procedures whose names or other documentation convey their purpose within the larger task. However, we know not all schools can guarantee a middle school sequence prior to this course. This lesson can be significantly abbreviated or skipped entirely based on the knowledge your students come in with!

This lesson will continue to build onto the first lesson on abstraction by beginning to look at what functions look like in code. Students will then focus on identifying function calls and arguments/parameters within functions.

This is more of a direct lesson than the first exploratory one of this unit, so feel free to insert any structures that you think would add play and joy to an otherwise very direct practice.

Objectives

Students will be able to:

  • Identify function calls

  • Identify arguments/parameters in functions

  • Describe the purpose of having arguments/parameters in a given function

Suggested Duration

1 Period (~45 minutes)

NYS Standards

9-12.CT.4 Implement a program using a combination of student-defined and third-party functions to organize the computation.

9-12.CT.5 Modify a function or procedure in a program to perform its computation in a different way over the same inputs, while preserving the result of the overall program.

9-12.DL.1 Type proficiently on a keyboard.

9-12.DL.2 Communicate and work collaboratively with others using digital tools to support individual learning and contribute to the learning of others.

Vocabulary

  • Function call: The name of a function, typed when you want to execute the specific steps the function represents

  • Parameters: The values of a function that can be controlled/altered whenever the function is called (inputs)

  • Arguments: Values passed through to a function’s parameters (input values)

Planning Notes && Materials

Planning Notes
Materials

This is a practice-heavy, fairly low-lift lesson. Practice can be completed on paper or as a digital worksheet, depending on classroom need and preference.

Practice Worksheet (digital or printed)

Post-Its/Notecards for Exit Slip (optional)

Resources

Assessments

Formative:

  • Function Call Worksheet

  • Exit Slip

Summative:

  • Make an Emoji (Mini Project)

  • Abstract Album Art (Final Project)

Do Now/Warm Up (2-3 Minutes)

Display on board: Yesterday you learned that we can abstract procedures into functions that you can use repeatedly in your code. Based on your learning so far, what do you think a function call is?

Function Calls, Arguments, and Parameters Mini Lesson (~10 min)

Begin by asking students to share answers to the do now, getting as many different answers as possible. Once you’ve heard student ideas, explain that a function call is just what it sounds like: it’s the name we use to call a function, which is a fancy way to say ‘make it happen’ in our program.

Explain that the function call is the name, followed by parentheses, and those parentheses may have some important information inside of them. This diagram can help:

Explain the important parts of a function and review with an ellipse. Then explain that students will be practicing identifying function calls, parameters, and arguments. Distribute the associated worksheet and fill in the ellipse space as a class.

Function Call Practice Worksheet (10 - 15 min)

Allow students time to complete the worksheet, either independently or with a partner or small group. One structure that may be useful in this context is Rally Coach (a Kagan Structure) where each partner folds their paper in half, and take turns coaching the other to complete a given problem on their side of the paper. It is important during this that at any given moment, only one person is writing while the other coaches - kind of like pair programming!

While students work, encourage them to get computers and use the reference sheet for anything that they may have forgotten or that they have not learned yet. Circulate and monitor progress as they work.

Return & Review (~10 min)

Once the majority of the class has finished, bring them together to review selected answers. It is not necessary to review every function on the page - it can become repetitive - but try to pick a few that are more straightforward, and a few that are more challenging. Additionally, make sure that you speak to at least one function that has no parameters and discuss that this is because the function is intended to run the same way every time as opposed to some of the others which change.

Remind students that next lesson, they will be creating their own functions. Bring their attention to the names of the functions which are all clear, concise, and do exactly what they say. This is best practice when they start writing their functions, as well!

Time permitting, you may want to preview function structure for the next lesson:

function washHands(brand, time){
    turnOnSink()
    getSoap(brand)
    sudsHands(time)
    rinseHands()
    dryHands()
}

Explain that the contents of this function are pseudocode, but the structure is the same as what they will be writing. Ask what they notice and what they are curious about, and use this to both close this lesson and launch the lesson for tomorrow.

Wrap-Up (3 - 5 min)

Consider having students write down their thoughts on what they notice about function structure, function calls, parameters, or arguments and using it as an exit slip.

Extensions

There are no extensions for this activity, but if your students move quickly through it, it could be shortened to allow more time for the following, more complex activities.

PreviousU1LA4.1: What is Abstraction?NextU1LA4.3: Draw with Functions

Last updated 2 years ago

(Worksheet)

✨
Functions, Parameters, and Arguments Practice
Diagram of an ellipse() function with paramters/arguments/function call labeled.