The ABCs of Javascript (Part 2)

Hello ✨✨, welcome back to my blog💛. It's been a long time and I absolutely missed writing here. In my last article, The ABCs of Javascript (Part 1), I wrote about the basics of javascript: variables and constants, data types and operators. I promise to have the concluding part out in a week after I published the initial part but I guess it's better late than never.

Before you continue reading this article, kindly head to read part 1 if you haven't.

Functions

Let me give a practical example here, I have a little bag where I keep all the stuff I use to make my hair: combs, dryer, straighteners, hair creams, hair treatment and many more. Basically, I have everything I need to make my hair in this bag and I only take it out whenever I need to visit the salon. A function in javascript is quite comparable to my little bag, it contains a block of code that is designated to do a particular thing. It is only executed when it is called upon just like my little bag is only used whenever I visit the salon. A single function can be called several times and used in different places. To declare a function you need 3 major things:

  • the Function name
  • parameters (these are totally optional)
  • curly brackets
function functionname (parameter-list) {
        lines of code 
      }

Let's name a function called hashnodeFunction and see how functions work. hashnodeFunction is going to add two different numbers passed into it as parameters and pop up our result in the console afterwards.

function hashnodeFunction(a,b) {
  let result = a  +  b;
  console.log(result)
}

Conditional Statements

Conditional statements are a little bit similar in structure to functions but they work in a different way. They are used to execute diverse actions based on different conditions.

- if statement

It defines a block of code that is to be executed if a specified condition is true

- else if statement

It defines a block of code that is to be executed if the condition stated in the initial if statement is false and the condition stated in itself is true

- else statement

It defines a block of code that is to be executed if the conditions stated in both the if statement and else if statement are wrong

if (√4 = +2) {
  console.log(+2 is a correct square root of 4)
} else if (√4 = -2) {
   console.log(-2 is a correct square root of 4)
} else {
   console.log(this is not a correct answer)
}

Kindly note that using the else and the else if statement is not mandatory.

Events

There is an absolute need for reactivity on our websites most especially on our HTML elements. In order for our javascript to react to these actions and events that occur in our HTML elements, we use javascript events. These events are connected to elements in the Document Object Model(DOM). Our javascript events are mostly bound inline in our HTML elements. Some of the most commonly used javascript events are

  • onclick
  • onkeyup
  • onmouseover
  • onmouseout

I hope you enjoyed the article and you learnt a bit. See you in my next article☺️ .