Our module works really well with a single function. In this movie, I am going to show you a technique called chaining. That you can use to make it easier to work with multiple methods. It's a really simple trick, that allows one function to call another. You've probably seen it in things like jQuery. So first, lets go ahead and create another method. Now, since my return function is an object, I need to put a comma right here. And then pass another parameter. This is going to be called run. And this is going to be a function, literal.
Just like the other one. And it's pretty much going to be the same thing as I have right here. So I'm going to copy the statements. And let's modify them a little bit. They're still going to read the argument array, or return nothing. Instead of statement here, it's going to say running. And instead of reading the safe paramter of my arguments. I'm going to ask it to look for something called speed. And my default is going to read, a variable called speed here as well. So I need to add that up here. So that'll be a speed variable. And the, the default speed is going to be normal.
And for my output, I am going to say, running. Then we'll space. I'll do three dots instead. And then I'll say plus. And pass at the variable running. Okay, so that should work pretty well. Lets go back into our index at HTML. And make sure that we have those 2 functions. So we can ask array to speak something, or also to run. And we can ask a different speed, here. So I'll say, fast. And if I run this, my output should say, howdy.
And then also, running fast. Perfect. Let's go ahead and just make sure that if I don't put an object. It's going to say by default, running normal. Perfect. So this is working pretty much like the other one. So you may have seen some libraries that make this a little bit easier, and more concise. By letting you use dot notation, to chain one function call to another. Now this really couldn't be easier to set up. But the thing is, that you really have to understand why it's working. All we have to do is make sure each function returns the calling object.
Remember that's exactly what the, this argument does and a function. Returned the object that contains it. Lets go back in our script. And what we'll do is, we'll issue a return statement inside each of these functions. And have it return this. Now that's all we need to do up here. We'll go back into our index at HTML file. And now this means that I can execute these by putting them right next to each other. So, I could say, ray.speak and then dot run. And notice that it's outputing the same thing.
I can even ask it to speak something. Right after your run. And now it says the three things howdy, running and run faster. And then I can even say run.run. And then pass it along a parameter here. Speed and then faster. Whoop, looks like I made a mistake here. I forgot to put this as an object. So I need to put the little curly brackets here. And that should work, running faster. So awesome.
So why is this working? This is a little sort of weird. If you don't get what's going on. And the reason is, that this parameter is going to return the instance of the object. So in other words, this is going to return the ray object, once again. Normally, return exits the current function. So, if I was out of this function. I wouldn't have the object that I needed to run the next method. But since I'm returning this, the last thing that the speak function will do is return the object itself.
And so therefore now, I have access back again to either my speak, or my run function. This technique is going to make your code just a little bit easier to call. And it makes it sort of fun to use. I've seen it used in libraries like D3 and jQuery. It doesn't take that much effort to set it up. Hopefully, after taking this course. You now understand why this is working. And you'll be able to utilize patterns like chaining, and other ones. Because you understand 'em.
- What are functions?
- Using functions as objects
- Understanding call-and-apply invocation
- Using the arguments parameter
- Returning values
- Understanding hosting and variable scope
- Chaining module method calls