close

Вход

Забыли?

вход по аккаунту

код для вставкиСкачать
JavaScript 101
Lesson 6: Introduction to
Functions
Lesson Topics





What is a function
Why functions are useful
How to declare a function
How to use a function
How functions are used with event handlers
What is a Function


As programs grow in size, they are easier to
manage if they are split up into smaller
pieces
JavaScript uses the term function or method
to describe these smaller pieces
Functions cont.



A function (or method) is a unit of code that
performs a specific, well defined task
Programming languages come with built-in
functions used to perform common tasks
Examples of JavaScript built-in functions:
 document.write – writes text to a Web document
 alert– displays a message inside a small window
with an OK button
 prompt– asks the user a question and stores the
answer in a variable
Why Functions are useful


Give structure and organization to your
code
Make programming easier


Instead of repeating and rewriting similar
code again and again, you can place the
code and use the function repeatedly
Often used as event handlers in
JavaScript
Function Declaration




Just like variables, functions need to be declared
or defined
Function declaration usually put in head section
The function declaration includes the function
name, its parameters, and the statements that
will execute
Function declaration syntax:
function functionname()
{
}
JavaScript statements go here
Parameters and Functions



Functions solve specialized problems or carry
out specific tasks
Often information relevant to the task is
needed by the function
This information made available to functions
through the use of parameters
Parameters


Parameters are special variables used
with functions
Examples of parameters:
alert(“This is the parameter!”);
Information inside ( ) is the parameter
for alert method
Parameters and Functions



A function may have zero or more parameters
(called the parameter list)
Each parameter name must be a legal
variable name and must be unique in the
parameter list
The syntax for a function with parameters is:

function functionname(parameter1, parameter2,…)
Return Statements and
Functions


Functions perform some kind of
calculation
Special feature of functions allows the
result of a calculation to be sent back to
the main part of a program

Similar to way functions in Excel display
the answer in a cell
Return Statements and
Functions


This is accomplished by using the
keyword return inside a function
The syntax for the return statement is:

return variablename;
How to use a Function


Using a function is referred to as function call
The syntax for function call with no
parameters:


functionname();
A function call for function with parameters:


functionname(parameter1, parameter2,…)
The function call must include the exact number
of parameters found in function declaration
Function Call and Event
Handlers


Functions are often used in conjunction
with event handlers to respond to user
events
Using a function makes an event
handler code looks cleaner and easier
to understand
In the lab





You will write a function that works with the
onClick event handler for a button
Your function will display an alert box and
change the background color
Open Notepad and create a new HTML
document named lesson0601.html
Enter code from p. 6-10 exactly as you see it
Save the file and open it using either Internet
Explorer or Netscape
Student Modifications

Modify the code on p. 6-11 as follows:


Change the colors used by the function
Add a second button and a second function that
use different colors and a different message
Adding a parameter



Save your work from the previous
exercise
With this example you will write a
function that has a parameter
Start a new html document, then enter
the code on p. 6-12 exactly as written
Student modifications

Modify the code on p. 6-12 as follows:



Add another button for another famous
quote, be sure to use the existing function,
just change the value of the parameter
Modify the function by adding a second
parameter
Use the second parameter in a second alert
box to display the author of the quote
Lesson Summary




Programs are organized and structured by
breaking them into smaller pieces
In JavaScript, these smaller pieces are called
functions or methods
A function is a set of statements that carries out a
specific task
You create own functions in JavaScript writing a
function declaration in the head of your Web
document
Lesson Summary (cont.)




The function declaration includes the function
name, its parameters, and the statements that will
execute
You write a function call to use the function
The function call consists of the function name
plus any required parameters
Functions are often used with event handlers to
organize and simplify a Web page’s response to a
user event
1/--страниц
Пожаловаться на содержимое документа