Front-End Developer

JavaScript Essentials

Learn the basics, objects, events, functions, arrays, loops, scope and dates.

1. Overview

JavaScript is one of the most popular programming languages in 2020. A lot of people are learning JavaScript to become front-end and/or back-end developers (using Node.js).

JavaScript is also the building-block of many front-end libraries/frameworks like React and Vue.js. Some developers jump straight into these frameworks and then realize they lack fundamental JavaScript concepts, so they take a step back and start studying JavaScript.

2. Objects

3. Functions

A JavaScript function is a block of code designed to perform a particular task. For a function to be executed, something needs to invoke it (call it).

Basic example

// Example of a JavaScript function that greets a person

// 1. Declare/create the function
function greetUser(userName) {
    // code to be executed
    return 'Hi ' + userName + ', nice to have you here!'
}

// 2. Invoke the function, passing a parameter
greetUser('John')
// Data returned by the function:
"Hi John, nice to have you here!"

4. Arrays

Get familiar with Arrays and how to interact with them. Learn about the methods you can use to manage Array items, including adding, removing or finding a specific item from the Array.

Basic example

// Creating an Array
let fruits = ['Avocado', 'Apple', 'Banana']

// Acessing an Array item using the index position
fruits[0]
// Data returned:
"Avocado"

5. Loops and Iterations

Once you're acquainted with arrays, you can now start to explore loops and iterations! In computer programming, a loop is a sequence of instructions/statements that is repeated until a certain condition is reached.

6. Scope