A High-Functioning Programmer
Here’s a short horror story: I learned how to write Javascript functions last week. Or, more accurately, I tried.
I’m sure many of you are probably experienced and fluent in Javascript, but perhaps you can remember when you first dove into the language. It can be difficult to adjust your thinking to be programmatic and then apply that logic using the appropriate syntax. There’s a lot of thinking that goes into it when you’re first learning.
I’m writing this blog post because my first week learning Javascript (last week, actually) was a little bumpy. I had ups and downs, but mostly I found myself being frustrated over and over by functions. I’m still feeling that way as I’m typing! So, in an effort to really learn and solidify the concepts I learned this week in my memory, I am going to try to explain functions in my own words. Here it goes!
In my understanding, functions in Javascript are essentially the verbs of your code. They are what make things go. They also control the flow of the logic through these steps. They also make the code easily repeatable. This is the real meat of Javascript, and what make it such a flexible and powerful language.
All of that is all well and good, but how the hell do you take that abstract concept and make it real, and on top of that, detailed enough that a computer can execute them? Well, isn’t that a good question. Here’s my attempt at an answer.
First and foremost, you need to have a detailed idea of what you want to accomplish. The key, in my opinion, is to write a pseudocode. Pseudocoding can help to do everything from brain-dump your random thoughts to organizing a bullet-pointed list of steps to write for a function. It can also be a way to refer to your functions’ and variables’ names in plain English while working. Referring to my pseudocode was the only thing that kept me sane, even when I was learning to write the simplest of functions. I truly believe it is a necessary step that should be taken before diving into the nitty-gritty of Javascript.
After pseudocoding, you are ready to jump in to coding! Don’t be intimidated: I found the most time-consuming part for me at first was gathering the courage to just start trying lines of code. Seriously, just start. It will save you a lot of time and anxiety.
Now take a deep breath. Here come the functions.
There are two ways to write a function. The first is a function expression, which are saved directly to a variable. Expressions are not hoisted, which means they must be declared before they are called.
The other kind is a function declaration. A function declaration is not saved to a variable. Another distinction is that it is hoisted, so it can be called before it is declared.
Functions essentially have five parts: declaration, keyword, parameters, instructions, and call. Feel free to reference the syntax above while I explain each of these things.
The declaration tells the computer “I am starting a function” and assigns the function a name. The keyword, which is “function”, explicitly states that this is a function, so the computer should prepare to follow some instructions. The parameter(s) are placeholder words that are used to insert values when the function is called. They are not always necessary, it just depends on if you need to input something into the function. Inside of the curly braces, there is code that is essentially a set of instructions. Lastly, in order to tell the computer to execute the function, it must be called. You can also reference your function in another function. This doesn’t call the function, so it doesn’t execute.
Another somewhat confusing aspect of Javascript functions for beginnings is the concept of scope. Scope defines what variables and functions are available at any point in the execution of the code. Where and how variables and functions are defined determines where they can be used throughout the code. They can fall into two different categories: local scope and global scope. Variables with a local scope cannot be used outside of that function they are created in. If a variable has a global scope, it can be used inside and outside of functions. There are a few other rules:
- Variables created without the var, let, or const keywords, no matter where they are in the program, have a global scope.
- Variables created with the var, let, or const keywords are created in the current local scope, and can’t be used outside of it.
- All functions create a new local scope. A consequence of this is that variables defined outside of any function are inherently global, even if the var keyword is used.
- The current scope includes all outer (enclosing) scopes.
I’ve found a lot of bugs in my code that stem from scope issues, so its worth memorizing these guidelines to help keep your code running smoothly. I’m still getting the hang of it.
Now, what is the result of a function? The answer to that is output. Whatever the function evaluates to is the output, which is noted by the keyword return. A good way to check your function is evaluating to the expected output is to console.log it, using console.log(functionName);. This will print the output of the function to the console, where you can puzzle over instead of guessing what the output was. A function can also have side effects, which are effects the function has on data external to its scope.
These are the concepts that I learned over the course of last week, and that I am trying to apply to my code. As you may know, each function is different and needs to be carefully considered and written individually, so it’s impossible to summarize every situation that could be encountered when working with them.
I hope that this information was helpful to someone else who is getting started on their coding journey. Feel free to reach out to me or comment your thoughts. I would love to learn more or have a discussion with you!
