Functions and Parameters

23
Functions and Parameters

description

Functions and Parameters. Structured Programming. Modular, Structured Programs. Program: Sequences, conditionals, and loops. Cohesive blocks of code. Request that blocks of code do work.  Transition to objects. Task. Generate payroll for employees. Steps. Retrieve employee information. - PowerPoint PPT Presentation

Transcript of Functions and Parameters

Page 1: Functions and Parameters

Functions and Parameters

Page 2: Functions and Parameters

Structured Programming

Page 3: Functions and Parameters

Modular, Structured Programs

• Program:– Sequences, conditionals, and loops.– Cohesive blocks of code.– Request that blocks of code do work.

Transition to objects.

Page 4: Functions and Parameters

Task

• Generate payroll for employees.

Page 5: Functions and Parameters

Steps

• Retrieve employee information.• Retrieve payroll data for employee.• Calculate gross pay.• Calculate federal income tax.• Calculate FICA tax.• Calculate state tax.• Calculate net pay.• Transfer net pay to employee account.• Transfer taxes to tax liability accounts.• Generate pay statement.

Page 6: Functions and Parameters

StructureGet Employee Data Retrieve employee information

Retrieve payroll data for employee

Calculate gross pay

Calculate federal income taxCalculate FICA taxCalculate state tax

Calculate net pay

Transfer net pay to employee accountTransfer taxes to tax liability accounts

Compute Net Pay

Deposit Funds

Prepare Pay Statement

Employees Remaining? Generate pay statement

Page 7: Functions and Parameters

ModulesGet Employee Data Retrieve employee information

Retrieve payroll data for employee

Calculate gross pay

Calculate federal income taxCalculate FICA taxCalculate state tax

Calculate net pay

Transfer net pay to employee accountTransfer taxes to tax liability accounts

Generate pay statement

Compute Net Pay

Deposit Funds

Prepare Pay Statement

Employees Remaining?

Page 8: Functions and Parameters

Benefits

• Easier programming.

• Easier, better testing – modules.

• Easier maintenance.

• Reusable modules.

Page 9: Functions and Parameters

Basic Functions

Page 10: Functions and Parameters

Function

• Module of code.

• Each function should:– Perform a well-defined task.– Be self contained.– Receive the minimum data to perform task.

• Return value is optional.

Page 11: Functions and Parameters

<html><head><script type="text/javascript">

function popupMessage(){

alert('Hello\nHow are you today?')}

</script></head><body><script type="text/javascript">

popupMessage()alert('Hello’)

</script></body></html>

Page 12: Functions and Parameters

Function Declaration

function popupMessage(){

alert('Hello\nHow are you today?')}

declaration name parameter list

start of function code

end of function code

Page 13: Functions and Parameters

Parameters

Page 14: Functions and Parameters

Function with Parameter

function popupMessage(message){

alert(message)}

parameter

use of parameter in function

popupMessage('Oh no!')show = 'JavaScript is fun!'popupMessage('show')popupMessage(show)

function call using a parameter

Oh no!JavaScript is fun!

Page 15: Functions and Parameters

Multiple Parameters

function popupMessage(line1, line2){

alert(line1 + '\n' + line2)}

popupMessage('Oh no!', 'Mr. Bill')show1 = 'JavaScript is fun!'show2 = 'HTML is easy'popupMessage(show1, show2)

parameters

function call with multiple parameters

Page 16: Functions and Parameters

Image Rollovers

Page 17: Functions and Parameters

Implementation Overview

• Precaching.

• Multiple images.

• OnMouseOver event.

• OnMouseOut event.

Page 18: Functions and Parameters

<body><img id="pic1" src="netpic1.gif" />

<script type="text/javascript">

alert(document.images[0].src)

alert(document.images.pic1.src)

alert(document.getElementById('pic1').src)

</script></body>

index

id

by id using method

images collection

images collection

Referencing Elements

Page 19: Functions and Parameters

getElementById

document.getElementById(id).target

target’s id

property or method based on target’s type (e.g., img)

Recommended for accessing HTML elements in JavaScript

Page 20: Functions and Parameters

Debugging

Page 21: Functions and Parameters

Techniques

• Browser options:– IE: Enable script error notifications.– Mozilla: Use JavaScript console.

• Debug messages:– Display “current position” alerts in code.– Display intermediate computations.

Page 22: Functions and Parameters

<script type="text/javascript">

var screenHeight = 0var screenWidth = 0var usableHeight = 0var usableWidth = 0var verticalWaste = 0var horizontalWaste = 0

screenHeight = screen.availHeightscreenWidth = screen.availWidthusableHeight = document.body.clientHeightusableWidth = documnet.body.clientWidthverticalWaste = screenHeight - usableHeighthorizontalWaste = screenWidth – usableWidth

alert('Vertical Waste: ' + verticalWaste + '\n' + 'Horizontal Waste: ' + horizontalWaste)

</script>

alert(‘ok so far’)alert(‘ok so far’)alert(‘ok so far’)alert(‘ok so far’)

alert(screenHeight)

Page 23: Functions and Parameters