In the last guide we walked through how to work with immediately invoked arguments and for the most part it's pretty straightforward in the sense that an immediately invoked argument is exactly what it says. It immediately invokes the argument and it is activated right away. However I think I'd be doing you a disservice if I didn't take a step back and show how closely related an immediately invoked function is compared with a normal one.

I want to go back to our dead simple full name kind of method something that takes parameters and I think that will help clarify everything. I'm going to start off by creating a function expression. I'm going to create one called full name and it's going to take in a few values, it's going to take in a string and another one called last which is a string. It's also going to return a string data type. Now I'm going to define the method so say full name equals function and then I'm going to just copy and paste this because it's the exact same code. And then from here I'm going to inside of the brackets put what this returns.

This returns first name and the last name and concatenates them. We've seen this a million times now to call it we can call console log full name and then pass in those values. Now if I run this in the terminal just to make sure that everything's still working that all works.

var fullName : (first : string, last : string) => string;

fullName = function(first : string, last : string) {
  return first + “ “ + last;
}

console.log(fullName(‘Jordan’, ‘Hudgens’));

So we've gone through this a million times you guys are probably already bored with going through. However it's important, I want to reinforce it and also so you can see how closely related a regular function is with immediately invoked function.. So now let's create a immediately invoked version of this full name method. I'm going to call it Alt full name and starting off with the syntax. I'm going to wrap it in parentheses. Type in function and now inside the parameters this is going to match exactly what we have here. So I'm going to copy this. Then after I've done that I just put in the curly brackets, and because this is an immediately invoked function I actually want to console log everything inside because if I just return it like I'd normally do in a real application then nothing would happen. We would see a console log first and I'll concatenate out the string space and then concatenate that with last and then at the very end I'm going to place the real values. You need to make those a string and then put a semi-colon at the end. Now if I run this code you'll see that that works perfectly.

(function(first : string, last : string) {
  console.log(first + “ “ + last);
})(‘Tiffany’, ‘Hudgens’);

Now this is why I wanted to give a guide completely dedicated to the way that immediately invoked functions work when it comes to arguments because if we were to take a look once again let me pull out the code for this one. We don't need all of this because we need it to run. I just want to show you the differences. So right here we have this function call we don't have a parameters and we have these empty parameters all over the place. This looks a little bit like black magic and I don't like when code looks like that because if you've never seen this kind of syntax before it might look kind of weird. However when you start to include arguments I think things start to make a little bit more sense because right here you can see that these parentheses right here these are what are going to take the arguments for the function exactly like how we did right here in the first line of the immediately invoked function but also exactly like how we did on just a regular function expression.

And that's really the point I want to drive home. Is that creating an immediately invoked function. Is the exact same as creating a regular function. The only key difference is that this function is going to run right away. That's the most important thing to remember. Now the Params at the very end. These are exactly like what we did here on line 8 when we called the method. So when we called the method and we placed our real world arguments in these real world values inside that's exactly what we're doing down here on line 13 because it immediately invoked function is immediately invoked and in runs these Params are what tell the program hey the second you get this to this line I want you to execute the function. If you do have arguments then these arguments are what are going to be passed in exactly like what we did right here. So that's the important thing to know. And the other cool thing with typescript is that we can enforce these types.

So if I change this to number you can see right away that this breaks the function and the compiler will not generate this code for us because we are trying to say that this is a number so that is how you can use immediately invoked arguments in typescript.

Resources

• Source code