This unit introduces basic function declarations or function statements. We'll cover more advanced topics in the subsequent courses. Functions perform a specific task and make your program modular, not one large chunk of code. The JavaScript language has many "built-in functions" that perform math, string, or date operations. JavaScript also allows you to develop your functions.
Completing this unit should take you approximately 2 hours.
This video provides an introduction to functions. Functions eliminate the need to write the same code repeatedly, which saves time. Functions also make your code much more manageable by segmenting a huge program into a number of functions, which makes modification efficient.
Functions are objects in JavaScript and can be used as variables in expressions, passed to other functions, or treated like numbers or strings.
The traditional function declaration has several parts:
Functions may have "parameters", values passed to the function from a calling program, but they are not required. To execute a function, it must be "called". This will run the statements in the body of the function. Read this article about how functions are defined and used. After reading this article, consider these questions:
There are several ways to define a function in JavaScript. We'll start by looking at the syntax (rules) for the traditional function declaration or function statement. It uses function name, parameters, and statement(s). Notice that function declarations can be hoisted, which means they can be called before they are declared.
JavaScript supports additional ways to define a function. This article describes the syntax for a "function expression". A function expression declares a variable and then assigns it to the function. That is, it is defined within the statement and does not need to be "called". Function expressions do not support hoisting.
Another way to define a function is by using the fat arrow (=>
). This article describes the syntax for the "arrow function" and compares it to the traditional or named function. The fat arrow is an ES6 (ECMAScript) notation, and support may not be in some browsers. ECMAScript is a specification for scripting languages, and JavaScript conforms to this specification. In addition, ES6 introduced features found in other languages, such as classes, the const keyword, and Unicode. You can learn more about the ES6/2015 specification at this link.
Watch this video that uses the function by expression notation to output a person's name. Try this example using an online editor or an editor of your choice. Remember to use one of the Linter programs if you have syntax errors in the program.
Try this exercise to see how well you understood working with functions and conditionals. Copy the code into your favorite editor and display an "interactive" web page that uses a function and a "while" statement to compute the current speed. This exercise does not count towards your grade. It is just for practice!
Take this assessment to see how well you understood this unit.