Wrox Programmer Forums
| Search | Today's Posts | Mark Forums Read
BOOK: JavaScript 24-Hour Trainer
This is the forum to discuss the Wrox book JavaScript 24-Hour Trainer Jeremy McPeak; ISBN: 978-0-470-64783-7
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: JavaScript 24-Hour Trainer section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old June 19th, 2011, 04:25 PM
Registered User
 
Join Date: Jun 2011
Location: Ontario
Posts: 2
Thanks: 1
Thanked 0 Times in 0 Posts
Default Functions

Hoping someone can help me further. I have read the section on functions and I am very confused by the first example. I don't understand how the function simplified the coding. I get the variables were typed 3 times in the original example, but how did the function make it easier??
 
Old June 21st, 2011, 10:24 AM
jmcpeak's Avatar
Wrox Author
Points: 467, Level: 7
Points: 467, Level: 7 Points: 467, Level: 7 Points: 467, Level: 7
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Nov 2005
Location: , Texas, USA.
Posts: 87
Thanks: 0
Thanked 18 Times in 17 Posts
Default

Howdy, rwhammond.

Functions allow us to group one or more statements/operations together. This is advantageous because:
  • it ultimately lessens the amount of code we have to write
  • it makes maintenance easier and less time consuming
  • we can execute them whenever we need to

So to use the example from the book, we start off with this code:

Code:
var valueOne = 100;
valueOne = valueOne + 150;
valueOne = valueOne / 2;
valueOne = "The value is: " + valueOne; // results in "The value is: 125"

var valueTwo = 50;
valueTwo = valueTwo + 150;
valueTwo = valueTwo / 2;
valueTwo = "The value is: " + valueTwo; // results in "The value is: 100"

var valueThree = 2;
valueThree = valueThree + 150;
valueThree = valueThree / 2;
valueThree = "The value is: " + valueThree; // results in "The value is: 76"
We're repeating the same set of operations three times, so we're writing 3x the amount of code. Also, if we need to change something (say from dividing by two to multiplying by two), we have to make that change three times. With a function, we can group the addition, multiplication, and string concatenation statements together:

Code:
function augmentValue(originalValue) {
    var augmentedValue = originalValue;
    augmentedValue = augmentedValue + 150;
    augmentedValue = augmentedValue / 2;
    augmentedValue = "The value is: " + augmentedValue;

    return augmentedValue;
}

var valueOne = augmentValue(100); // results in "The value is: 125"
var valueTwo = augmentValue(50);  // results in "The value is: 100"
var valueThree = augmentValue(2); // results in "The value is: 76"
By adding the function, our code is simplified because:
  • we're writing less code.
  • maintenance is easier; if we need to change anything within augmentValue(), then we do it only once as opposed to three times.
  • we can call augmentValue() anytime we need to.

To give an example for maintenance, let's add a statement that multiplies by 5. In the first example, we'd have to do this:

Code:
var valueOne = 100;
valueOne = valueOne + 150;
valueOne = valueOne / 2;
valueOne = valueOne * 5;
valueOne = "The value is: " + valueOne;

var valueTwo = 50;
valueTwo = valueTwo + 150;
valueTwo = valueTwo / 2;
valueTwo = valueTwo * 5;
valueTwo = "The value is: " + valueTwo;

var valueThree = 2;
valueThree = valueThree + 150;
valueThree = valueThree / 2;
valueThree = valueOne * 5;
valueThree = "The value is: " + valueThree;
I've just added three more lines to that code while introducing a bug. So my program doesn't work now, and I have to spend time finding where I went wrong.

With a function, it's much easier:

Code:
function augmentValue(originalValue) {
    var augmentedValue = originalValue;
    augmentedValue = augmentedValue + 150;
    augmentedValue = augmentedValue / 2;
    augmentedValue = augmentedValue * 5;
    augmentedValue = "The value is: " + augmentedValue;

    return augmentedValue;
}

var valueOne = augmentValue(100); // "The value is: 625"
var valueTwo = augmentValue(50);  // "The value is: 500"
var valueThree = augmentValue(2);  // "The value is: 380"
All I had to add was one line of code to the function.

That's basically how the function-ized code is easier than the original:
  • it lessens the amount of code we have to write
  • it makes maintenance easier and less time consuming
  • we can execute them whenever we need to

I hope that made it a little clearer.
The Following User Says Thank You to jmcpeak For This Useful Post:
rwhammond (June 21st, 2011)
 
Old June 21st, 2011, 01:22 PM
Registered User
 
Join Date: Jun 2011
Location: Ontario
Posts: 2
Thanks: 1
Thanked 0 Times in 0 Posts
Default

Thanks Jeremy. That was the perfect explanation! It cleared up exactly what I wasn't comprehending. Thanks!




Similar Threads
Thread Thread Starter Forum Replies Last Post
Using functions crashbandicoot BOOK: Beginning HTML, XHTML, CSS, and JavaScript 0 April 12th, 2011 06:21 PM
C# functions daniel.mihalcea C# 2008 aka C# 3.0 3 September 11th, 2008 05:10 PM
Functions czambran BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0 13 July 11th, 2006 06:33 PM
functions xelepi PHP How-To 1 March 10th, 2006 02:59 AM
Help with Functions megabytes C# 1 August 7th, 2003 12:48 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.