#100DaysOfWeb in Python Transcripts
Chapter: Days 25-28: JavaScript Introduction
Lecture: Functions

Login or purchase this course to watch this video and the rest of the course contents.
0:00 This video is about functions. Like in Python, functions are first-class citizens. They can be assigned to variables, passed around, et cetera
0:13 with one or more expressions, also called side effects and can optionally return a value. It's not required though. Each function creates a new scope.
0:24 Localizing the find parameters and bindings not visible from the outside. Functions can be nested also called Closures, and call themselves
0:37 recursion just like in other languages and they can have one or more parameters or arguments. And here's some more information.
0:50 So that's stacks trading. A function is defined with a function reserved word, a name optionally you can give it arguments
1:01 and a block is defined within curly braces. So in this case I am just going to bounce 'Hello' + name and we close off the function.
1:15 To call it, I can give it a name and we see "Hello Mike" just as we would expect. If we omit the argument we get "Hello undefined".
1:31 And here again we see JavaScript's more permissive because Python would raise an exception for example. Type Error and expects one argument
1:49 and it doesn't allow you call it without that argument. Not so in JavaScript, and we'll see later how we can set default arguments.
1:59 Let's return the value Next. So I'm going to do a function Calculation2Celcuis that takes a Fahrenheit temperature does the calculation
2:28 And returns the value. So now I can call this with say 100 Fahrenheit and I see that's 37.7 Degrees. Great. Now let's talk about arguments.
2:41 JavaScript functions keep an internal array like object with the arguments passed in. So to Demo let's just write a function called PrintArguments
2:55 that's going to print them out. So we can do For let arg of arguments Console Log of arg
3:15 close up the for loop and close up the function. So calling it without anything I don't get anything Calling it with 1,2,3 I get 1,2,3.
3:31 Arguments is only accessible within the function because it's called to the block inside the function. Okay, calling it with a bit more.
3:48 So next, how would you handle default arguments. For example we want to do another hello function and if name is not provided we want to
4:01 bounce a "Hello stranger" message for example. So one way to do it is to check name against undefined and we will come to this with JavaScript gotchas
4:15 with our two comparison operators 2 equal signs and 3 equal signs and you usually want to use the 3 equal signs because it not only checks for equality
4:27 but also the same type. So here it will exactly match undefined. And that's just more specific and you probably make less mistakes.
4:37 So if name is undefined and doing this in the same line I can omit the curly braces I can set name to "Stranger" and then do the printing.
4:58 Let me close those off with semi colons as is best practice. So now if I call it without anything I get "Hello Stranger" If I call it with a name
5:11 I get "Hello Name." So that's one way to handle default arguments. But there's a nicer way and it's similar to Python. So as you know you can set
5:20 a default argument in Python like this. And now if I call it without anything I get "Stranger" and when I call it with a name I get "Hello Name."
5:35 And starting ECMAScript 2015 JavaScript now has the same syntax So we can write function Hello Name = default "Stranger"
5:53 I don't think there's an Fstring. No there's something similar actually. You can do backticks and embed the very role like this.
6:09 I call it without anything I get "Stranger" I call it with Mike, I get "Hello Mike". So JavaScript is gaining a lot of nice improvements lately.
6:22 Another one I want to show you introduced in ES6 is Arrow Functions. And to use the same example you can write it even shorter.
6:38 We can omit the function reserved word. And instead of a block we can just use the Equal Greater Than or Fat Arrow I think it's called
6:51 and print the string. Let's assign it to a variable. And now I can call it like this
7:08 or passing a name. So a bit more concise syntax. Arrow Functions are pretty exciting and again JavaScript syntax is getting a lot better.
7:21 So to recap a simple function Function, Reserved Word, name of the function Parameters, in the body inside curly braces which defines a new scope.
7:32 And you can do some work and optionally return a value. And when we print it to the console it will return the value as a string.
7:46 So function takes input parameters and returns one or more values. You read it a typical calculation from Fahrenheit to Celsius
7:57 and calling it with 100 Fahrenheit, you get 37.7 Celsius. Arguments. Internally JavaScript functions keep an array like arguments object.
8:12 And here we print all the arguments passed in. When we call this function with 1,2,3 it prints 1,2,3. So how would we then handle default arguments.
8:25 The old way is to look explicitly for undefined and set the name to a default value. But lately with ECMAScript 2015 we got the new Python like syntax
8:37 of sending a default value in the parenthesis and that's way nicer. Lastly ES6 introduced Arrow Functions
8:49 which introduces a more concise way to write functions. You can use it on one line like this send to variable and call it.
8:59 Because functions are passed around as first class objects. That's definitely not all there is to functions but it's enough to get you started.
9:10 Functions are an important building block when your programs grow and when you have to interface with other parts of the program. Next up are Objects.


Talk Python's Mastodon Michael Kennedy's Mastodon