mirror of https://github.com/01-edu/public.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
3.3 KiB
107 lines
3.3 KiB
4 years ago
|
## What is my purpose?
|
||
|
|
||
|
![robot](https://cdn.discordapp.com/attachments/489466992286498816/828181029772197888/butter-purpose.png)
|
||
|
|
||
|
### Remember Methods?
|
||
|
|
||
|
You have seen how to call functions that were stored in object properties.
|
||
|
|
||
|
Remember this example of function call?:
|
||
|
|
||
|
```js
|
||
|
// ↙ identifier, like variables
|
||
|
console.log('Hello There !') // <- function call happening here
|
||
|
// ↖ open paren + argument + close paren
|
||
|
```
|
||
|
|
||
|
or these ones?:
|
||
|
|
||
|
```js
|
||
|
let roundedValue = Math.round(1.8) // another function call happening here
|
||
|
console.log(roundedValue) // and another one here
|
||
|
```
|
||
|
|
||
|
There, we saw how to call and use _"pre-declared"_ functions.
|
||
|
|
||
|
Here, now, we are going to learn how to declare our owns. This will gives us
|
||
|
even more freedom to build our own logic.
|
||
|
|
||
|
### Declaring a very basic function
|
||
|
|
||
|
We mentioned before that a function had to be either assigned to a variable or
|
||
|
an object property.
|
||
|
|
||
|
We will now declare one in a variable. Let's call it: `myFirstFunction`.
|
||
|
|
||
|
Once a variable is declared; Remember how an array can be recognized with this
|
||
|
syntax : `[]`? or an object with this one : `{}` ?
|
||
|
|
||
|
Well, we will use another syntax for declaring our function. We will do so using
|
||
|
the `ArrowFunctionExpression` syntax : `() => {}`
|
||
|
|
||
|
- So we first put parens `()`, These, are the containers of the `arguments` that
|
||
|
go in the function. For now we will leave them empty with no arguments. (More
|
||
|
on those later on)
|
||
|
- We then add the arrow `=>` which is the distinguishing feature of the
|
||
|
`ArrowFunctionExpression` syntax.
|
||
|
- Finally, we add the curly brackets `{}` to delimite the scope of our newly
|
||
|
created function. Note: They are not always necessary, you will probably find
|
||
|
examples of this function syntax without the `{}`. However, for now because
|
||
|
you are learning. We will put them most of the time.
|
||
|
|
||
|
```js
|
||
|
// ↙ normal variable ↙ beginning of the scope of the function
|
||
|
let myFirstFunction = () => {
|
||
|
// ↖ parens () for arguments and the arrow => for syntax
|
||
|
} // <-end of the scope of the function
|
||
|
```
|
||
|
|
||
|
It's now possible to call this function using the `()`, like any pre-declared
|
||
|
function:
|
||
|
|
||
|
```js
|
||
|
myFirstFunction() // nothing happens
|
||
|
```
|
||
|
|
||
|
This function if called, does not do anything, since it doesn't contain any
|
||
|
code.
|
||
|
|
||
|
### The scope of a function `{}`
|
||
|
|
||
|
Very much like an `if` statement a function has a scope. The scope in between
|
||
|
the curly braces`{}` is where the action happens. Let's add something to the
|
||
|
scope of our function.
|
||
|
|
||
|
```js
|
||
|
let myFirstFunction = () => {
|
||
|
console.log('Calling my first function')
|
||
|
// ↖ some instructions to do when the function is called !
|
||
|
}
|
||
|
```
|
||
|
|
||
|
Now the function if called, display the output the `console.log()`.
|
||
|
|
||
|
```js
|
||
|
myFirstFunction() // "Calling my first function"
|
||
|
```
|
||
|
|
||
|
We actually used a function and gave it this single instruction:
|
||
|
|
||
|
- call another function `console.log()`.
|
||
|
|
||
|
### Instructions
|
||
|
|
||
|
You are a robot made by a scientist called Rick and you want to know your
|
||
|
purpose. We have declared the object `dialogue`. Declare **and call** a function
|
||
|
named `whatIsMyPurpose`.
|
||
|
|
||
|
- This function will display in the console the value of the key `myQuestion` in
|
||
|
the object `dialogue`.
|
||
|
|
||
|
Declare **and call** a function named `theAnswer`.
|
||
|
|
||
|
- This function will display in the console the value of the key `Rick's answer`
|
||
|
in the object `dialogue`.
|
||
|
|
||
|
Hint : Make sure your console is open if you want to see the actual answer :)
|