Functions
executes code chunks when called
http://www.w3schools.com/js/js_functions.asp
Thursday, October 1, 2009

surprise!
you already have been using them
since your first line of code
document.write, alert, prompt, confirm, parseInt, etc.
Thursday, October 1, 2009

defining a function
function foo() {
// some code
}
Thursday, October 1, 2009

defining a function
function keyword
function foo() {
// some code
}
Thursday, October 1, 2009

defining a function
function keyword function name
function foo() {
// some code
}
Thursday, October 1, 2009

defining a function
function keyword function name parenthesis
function foo() {
// some code
}
Thursday, October 1, 2009

defining a function
function keyword function name parenthesis
function foo() {
// some code
}
start of function
Thursday, October 1, 2009

defining a function
function keyword function name parenthesis
function foo() {
// some code
}
start of function
end of function
Thursday, October 1, 2009

braces always mean
start and stop
(if, else if, else, for, for...in, while, functions, objects
Thursday, October 1, 2009

calling a function
// define function foo
// for later use
function foo() {
// some code
}
// call the function and
// run the code inside it
foo();
Thursday, October 1, 2009

functions are called using
parenthesis and the function name
()
Thursday, October 1, 2009

calling a function
// define function foo
// for later use
function foo() {
// some code
}
// does not execute function
foo;
// executes function
foo();
Thursday, October 1, 2009

the code inside functions only
executes when the function is called
var number_1 = 5;
var number_2 = 10;
var sum = number_1 + number_2;
function foo() {
alert('This will never alert.');
}
alert(sum);
// only sum will be alerted
// the string inside foo function does
// not because foo was never called
Thursday, October 1, 2009

functions can return values
// define the function
function name() {
return 'John Nunemaker';
}
// call the function
var name = name();
// name variable is now 'John Nunemaker'
Thursday, October 1, 2009

the instant a return statement is found,
the function returns and stops execution
Thursday, October 1, 2009

return doesn’t have to
return a value
function demoReturn() {
return;
// this will never be called
alert('hi');
}
// will not alert ‘hi’
demoReturn();
Thursday, October 1, 2009

functions can have
a parameter
// define the function
function name(name) {
return 'The name was: ' + name;
}
// call the function
var message = name('Ron Burgandy');
// message variable is now 'The name was: Ron Burgandy'
// call the function again with different name
message = name('Veronica Corningstone');
// message variable is now 'The name was: Veronica Corningstone'
Thursday, October 1, 2009

functions can have
a parameter
name is a parameter
// define the function
function name(name) {
return 'The name was: ' + name;
}
// call the function
var message = name('Ron Burgandy');
// message variable is now 'The name was: Ron Burgandy'
// call the function again with different name
message = name('Veronica Corningstone');
// message variable is now 'The name was: Veronica Corningstone'
Thursday, October 1, 2009

functions can have
a parameter
name is a parameter
// define the function
function name(name) {
return 'The name was: ' + name;
}
‘Ron Burgandy’ is an argument
// call the function
var message = name('Ron Burgandy');
// message variable is now 'The name was: Ron Burgandy'
// call the function again with different name
message = name('Veronica Corningstone');
// message variable is now 'The name was: Veronica Corningstone'
‘Veronica Corningstone’ is an argument
Thursday, October 1, 2009

functions can have
multiple parameters
// define the function
function fullName(first_name, last_name) {
return first_name + ' ' + last_name;
}
var wes = fullName('Wes', 'Mantooth');
// wes variable is now 'Wes Mantooth'
var brian = fullName('Brian', 'Fantana');
// brian variable is now 'Brian Fantana'
Thursday, October 1, 2009

philosophical tidbit
parameter - name of value to be used in function
argument - value passed in when function called
Thursday, October 1, 2009

camelCaseFunctionNames
Thursday, October 1, 2009

naming conventions
// variables use underscores
var full_name = 'John Nunemaker';
// functions use camel case with lower first
function fullName() {
return 'John Nunemaker';
}
Thursday, October 1, 2009

function can be made
up of any code
function demoWithLoop(loops) {
for (var i=0; i < loops; i++) {
alert("Why'd you have to wait...");
}
}
// two alerts
demoWithLoop(2);
Thursday, October 1, 2009

functions, ifs, loops
function demoWithLoop(loops) {
if (loops > 10) {
alert('DO NOT WANT!');
} else {
for (var i=0; i < loops; i++) {
alert("Why'd you have to wait...");
}
}
}
// alert DO NOT WANT!
demoWithLoop(11);
// 4 alerts of Why'd you have to wait...
demoWithLoop(4);
Thursday, October 1, 2009

functions, ifs, loops, return
function demoWithLoop(loops) {
if (loops > 10) {
alert('DO NOT WANT!');
return;
}
for (var i=0; i < loops; i++) {
alert("Why'd you have to wait...");
}
}
// alert DO NOT WANT!
demoWithLoop(11);
// 4 alerts of Why'd you have to wait...
demoWithLoop(4);
Thursday, October 1, 2009

assignment06
http://teaching.johnnunemaker.com/capp-30550/sessions/functions/
Thursday, October 1, 2009