Preview
Video Player
00:00
00:00
Concise Arrow Function Syntax
3:16Arrow function syntax can be even more concise. In this video we'll modify existing arrow functions to be shorter.
Arrow functions are less robust
than function declarations.
0:00
But they can't get even more concise.
0:03
If your arrow function only
takes a single argument like in
0:06
the case of square and cube,
you don't need parenthesis.
0:11
You can't remove parenthesis
on functions with no or
0:18
multiple arguments,
only on functions with singe arguments.
0:22
If you're only using one line of code,
you don't need the return keyword.
0:26
It will always return
the value of the statement
0:32
without the use of the return keyword.
0:35
You can reduce the arrow syntax
further by removing the curly braces
0:38
when you only have a single line
of code in your arrow function.
0:42
If you haven't got multiple
lines of code in your function,
0:48
this can really clean up
the code to be more concise.
0:51
Let's also make the cube function more
concise by removing the parentheses,
0:55
the return key word with the curly braces.
1:01
Can we make the rest of these
functions more concise?
1:07
Multiply, add, and
subtract are all one line long, so
1:12
we can omit the returns and
the curly braces.
1:17
Since there are two arguments for
each function,
1:32
we have to leave the parentheses.
1:35
Finally, let's take a look at
functions with no arguments.
1:39
Take a look at the sayName function.
1:44
The sayName arrow function
has two lines of code.
1:47
So we can't reduce this further.
1:53
Also there are no arguments, so
we have to leave the parenthesis.
1:55
The sayBye function can be reduced to
a single line because there's only one
2:00
line of code in the function block.
2:05
And there you have it.
2:10
We've refracted several function
declarations into arrow function
2:11
expressions.
2:15
This shorter syntax can
look strange at first.
2:17
Take a look in the fourth and final file.
2:21
Each one of these divide functions
Are all functionally the same.
2:25
The function declaration,
The function expression,
2:32
and then arrow functions perform the same
task, dividing one number by another.
2:38
I'd encourage you to get in additional
practice by rewriting some of your
2:46
own existing JavaScript programs
to use the arrow function syntax.
2:50
Most documentation, articles and
2:55
courses about JavaScript use
this new arrow function syntax.
2:57
It's also expected of you as a JavaScript
developer that you understand
3:01
the syntax too.
3:05
All modern browsers have support for
the arrow function syntax.
3:06
So it's never been a better time
to start using it yourself.
3:10
Until next time, keep coding.
3:14