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.
Functions
