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