A primer on Javascript functions and where to find them

The why

Learning Javascript, be it for the front-end or the back-end can be felt both as a daunting or easy task depending on how you approach the language and whether or not it's your first flirt with programming languages in general.

But putting aside unexplicable rivalries, one can surely appreciate the ease and cross functionality of the Javascript language, especially if we want to consider starting out with a forgiving language that doesn't care for us to care for it. Poor Javascript.

What do I mean by that? Well, as I said in my previous post, Javascript Projects for beginners, age 9 to 99, JavaScript is a dynamically typed language, meaning that it doesn't care if you use variables for integers and then change them to string and then again to objects. Javascript will be the cool dude and allow you anything.

const crying = await UserUsingJavascript()

console.log(crying) // Promise

let userVariable = 1

userVariable = 'One'
userVariable = {
    'One': 1,
}

typeof userVariable // object

crying.then((tears) => {
    throw new Error('Ha ha!')
})

What they don't tell you is that later on you're gonna cry for some weird Error appearing in your console and that's where Javascript is tasting its revenge. Sweet.

Of course, all of this is a joke but there is a reason why statically typed languages (like C, C++, GO, Rust, Typescript) are all the fuss after a while. They add on more logic and boilerplate but they make the code and coding experience safer for you, the coder.

But again, this article is about Javascript functions and how to find what the standard library makes available to us, so let's go back to our main topic and discuss!

The how

What is a Javascript Function tho?

I'm not too keen on formalities so I'll just put it out there. A Javascript function is just a container of re-usable code. That's it. No magic around it, no big scary words.

A Javascript function makes your code go from this:

console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')
console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')
console.log('I love Javascript')
console.log('I hate Javascript')

to this:

function meAndProgramming(feeling, times, language){
    let feels
    for(let i = 0, i < times; i++){   
        feels = feeling[i%2]
        console.log(`I ${feels} ${language}`)
    }
}

meAndProgramming(['love', 'hate'], 10, 'Javascript')

Does it look scary and more difficult? Of course it doesn't seem as easy as just repeating console.log all the times you need, but look at it from this perspective:

Now you can generalize what you are logging and you can log how many times you wish just by changing that number. Not only that, we went one step further and also generalized the subject of the feeling (hate or love) and used the modulo tool (%) to see whether the feeling should have been love or hate.

Are you thinking, like I'm thinking, that we went a little bit overboard? We did, but only to prove that you can generalize and abstract all kinds of logical implementation if you want to!

One of the most useful and ambitious places where you can find any information about Javascript on the front-end is the Mozilla Foundation website.

I often go there to search for native utilities and functions I don't remember (and trust me, it happens a lot!) and I also translated a few articles in my native language (italian).

One of the easiest tricks if you are working with your browser console open is to pick the object of your dilemma, because everything is a freakin object in Javascript, and put a dot in front of it, like so:

let myArrayVariable = []

myArrayVariable. // [browser will try and autocomplete]

At this point the browser's console will try and show you all the available methods for that particular Object Type.

If this is not how you want to discover the available methods of a Javascript Object, then you could also install an intellisense extension on your preferred developer environment. I'm using VSCode so this comes with the installation.

In case you want to know more about VSCode and Javascript Intellisense, here's a good link!

Getting to know more of Javascript everyday is fun and you get to discover a lot of new ways to build your things, so keep up the good work!

The goodies

Hopefully you enjoyed this article and know a little bit more about Javascript functions than you did before.

Check out the Learn Javascript website or FreeCodeCamp for other great tutorials!

Happy hacking!

The goodbye

I hope you found this article useful and to your liking and if you have any requests, drop a message on one of my social media accounts or open an issue/start a discussion on github, on this repository!