This document discusses JavaScript functions. It begins with an agenda that outlines reviewing a pizza project, functions, parameters and arguments, the return keyword, and a lab. It then defines functions as reusable blocks of code that can be run multiple times. It discusses the basic structure of a function, naming functions, and using built-in and custom functions. It also covers parameters and arguments, using the return keyword to return values from functions, and code examples to demonstrate functions, parameters/arguments, and returning values. It concludes with instructing the reader to create a quiz testing HTML/CSS/JS knowledge and continuing work on the pizza site project.

1. Front-End
Web Development
Lesson 8
Functions

2. Agenda
●
●
●
●
●
Review Pizza Project
JavaScript Functions
Parameters and arguments
The return keyword
Lab

3. Functions
A function is a series of programming steps that
you set up at the beginning of your script
●
●
●
write code once
run code any time you like
run code as many times as you like

4. Functions
Basic structure:
function functionName() {
// the JavaScript you want to run
}

5. Functions
Naming functions (examples):
● calculateTax()
● getScreenHeight()
● updatePage()
● fadeImage()
Cannot use JavaScript reserved words

6. Code Along
Need template.html and two css files.
Save template.html as print_date.html
Two steps:
● create function in head
● call function in body

7. Built-In Functions
JavaScript Built-in Functions
String Methods
toLowerCase()
Date Methods
toDateString()

8. Parameters & Arguments
Parameters are variables used to accept
information into a function.
Arguments are values used to supply
information to a function.

9. Parameters & Arguments
Example:
function print(message) {
document.write(message);
}
parameter
argument
print(‘Example of parameters and arguments’);

10. Code Along
parameters.html

11. Retrieving Info from Functions
To return a value from your own functions, use
the return keyword.
Notes:
● the return keyword should be the last
statement in a function
● a function can only return one value

12. Retrieving Info from Functions
Example:
function functionName(parameter1, parameter2) {
// the JavaScript you want to run
return value;
}

13. Code Along
tax.html
quiz.html

14. Lab
Create a quiz (at least five questions) testing
the user’s knowledge on the HTML, CSS and
JavaScript you’ve learned so far.
● make functional first
● make stylish last
● upload to server
● ask classmates to take the quiz

15. Lab
Build out pizza site:
● add date
● add sales tax function
Create index page for your server