Just sort of a universal stuff for building things. We make functions using the function expression, or function literal. It will return a new function object which could then be invoked. A function expression starts with the word function. It can then take an optional name, which allows you to call the function recursively. It also allows for documenting things like the code and stack traces.
You pass it parameters, which are a set of names separated by commas, wrapped in parens. And it takes a body, which is a block wrapped in curly braces. A function expression produces an instance of a function object. And every time that expression gets evaluated, you'll get a new function object. Function objects are first class, which means they can be passed as arguments to functions. They can be returned from functions. The may be assigned to variables.
It can accept any type. And variables declared anywhere within a function are visible everywhere within the function. So we don't have block scope with the var statement. We only have function scope. So the var statement does a really weird thing. It gets split into two parts. The declaration part gets hoisted to the top of the function, where the variable gets initialized with undefined. And the initialization part turns into an ordinary assignment statement.
In this case the name is mandatory. You can't leave it out. It takes the same parameters. It takes the same body. So it looks exactly like the other one. The function statement is a shorthand for a var statement with a function value. So function foo expands into var foo equals function foo. And that further expands because of hoisting into var foo equals undefined and foo equals function foo. Both of these now get hoisted to the top of the function.
So it's really confusing having both function expressions and function statements, which both look exactly the same. So how do you tell them apart? And it depends on where you are. If the first token of a statement is function, then it is a function statement. If the word function occurs any place else, it's a function declaration. So we talked this morning about scope, about block scope versus function scope, and block scope is a very common thing.
So if there's a second var declaration for the same name, good, that's double good. It should be an error, but it's not. And because it's not an error, you can get into trouble. So because of all of this weirdness, I recommend declare all of your variables at the top of the function. Because that's where they're actually being declared. And also declare all of your functions before you call them. All of this hoisting nonsense was created specifically so that you don't have to do that.
I can say... - [Student] Oh, I see what you mean. - I can say food param. And then below that I can say function food. - [Student] You don't mean to say var some function name and then later on define the function. I, I see. Never mind. These two statements, there's not this parallel between these two statements that I'm looking for. Function statements are, functions are variables. - No, functions are values that can be stored in variables. - [Student] Okay. If they have a name.
- Even anonymous functions can be stored in variables. - [Student] Okay.
This course was created by Frontend Masters. It was originally released on 6/20/2016. We're pleased to host this training in our library.
- Writing code for performance
- Script tags
- Nodes and events
- ES5 and ES6
- Principles of security
- Object capabilities
- Synchronous functions
- Asynchronous functions