How JavaScript was created

JavaScript is currently the most popular programming language in the world, according to Github and StackOverflow. Created in just 10 days, JavaScript has gained enormous popularity and is currently used by virtually every company in the world, both as a front-end and back-end technology.

In 1995, Brendan Eich created in a record-breaking amount of time a language that enables the creation of interactive sites. The name has been changed several times - the initial Mocha and LiveScript were eventually replaced by JavaScript. However, it should be remembered that despite similarities in names, JavaScript is not the same as Java. Although the first one drew inspiration from the other, JavaScript is a completely separate programming language.

Today's versatility has contributed to the popularity of JavaScript. Every serious website uses JavaScript. More and more often programmers use its framework versions, such as React.js created by Facebook, or Angular.js written by Google programmers. JavaScript is no longer just a front-end language (i.e. responsible for displaying web pages and user interactions), but it is also a back-end environment (i.e. used to process data on the server side) in the form of Node.js whose popularity has been increasing each year.

Let's get to know the basics of this most popular language and see how easy it is to program in it.

Variables

A variable is the basic unit for storing data in JavaScript. It is declared by entering the keyword var (shortcut from variable) followed by a name of the variable. Then, after the equality sign (the assignment operator „=“), you give the value you want to store in it.

Example:
var number1 = 5;
var number2 = 2;
var number3 = number1 + number2;
In this example: A variable stores a value. This value can be also changed:
var apple = "apple"; // now the variable apple stores the word "apple"
apple = "pineapple"; // now the variable apple stores the word "pineapple"

You can imagine a variable as a box. With the use of var, we create it, and after the equality sign we state what we want to put into it. If we want to put a new thing in it, then we do not create it all over again. We simply point it out and declare what we put in this time.

It should be remembered that the name of each variable should be unique. It can be a short name (x or y) or - which is in accordance with good practice - more descriptive (name, city, age).

Variables in JavaScript:

In JavaScript, the "=" sign is an assignment operator, which means that we do not use it as a normal equality sign. If you want to compare two variables and thus find out if they are the same, use "==", the double equal sign (this will return true or false).

Variables can store different types of data. The most important of them are:

Number - all numbers, e.g.

// variable numberOfChild stores the number of children in the class
var numberOfChild = 12;

String – words or strings of characters, e.g.

// variable message stores the text
var message = "This is a sentence.";

Boolean – true of false, e.g.

// variable loggedIn stores information if a user is logged in (true = yes, false = no)
var loggedIn = true;

Remember that string (words) variables should always be in quotes. Take a look at the following differences:


Exercises

Before you begin, go to repl.it and create an account by clicking on the “Sign Up” button in the upper right corner. Then, follow the instructions on the page to verify your account.

Setup an account on repl.it

Did you succeed? Great! Now you can proceed to the exercises.

Remember to click "Fork" each time you go to a page with an exercise. This will allow you to make changes to the code. Always select the file "index.js" (in the menu on the left), unless the instruction tells you otherwise.

Exercise 1

Take a look at exercise 1 in the link below:

Run exercise #1

Before you start: select the index.js file (in the menu on the left) and press "Run" (above the code window) to generate the code. Do not change the statement document.getElementById ('ex1').innerText. It is for the variable to be visible immediately after the text "Result of exercise 1:".

Look at the variable after the "+=" sign and the variable declaration line up. Can you tell why the text underneath does not display? Correct the code so that everything works properly.

Tip: If you are stuck, read the paragraph with variable names, look at the code from exercise 1 and compare both lines.

Excercise 2

As we said earlier, variables are declared using the keyword "var" followed by the name and then followed by its value after the assignment operator (sign =). If the value is in quotes, it means it contains a word/text (string).

In the code for exercise 2 you will find a variable named favoriteLanguage. Assign a text (string) to it with your favorite programming language (e.g. JavaScript). If everything is fine, it will be displayed below.

Run exercise #2

Excercise 3

In variables, we can also store numbers on which we can then perform arithmetic operations (+, -, *, /). In the code for exercise 3 you will find a variable named result, which adds variables number1 and number2 and is displayed below the equal sign. Give variable number1 and number2 numeric values so that the result of the equation underneath is correct.

5 + 12 = NaN

Run exercise #3

Tip: If numbers do not add up correctly, they stick together - that means they are unnecessarily surrounded by quotes. In this case, the computer treats them as strings/ text rather than numbers.

Excercise 4

In JavaScript code, exercise 4 has another type of variables - boolean, which takes only two values: true or false. Typically, variables of this type are used to control our program and tell it whether it has to do something or not.

Run excercise #4

Complete the variables so that the program knows what the weather is like. If you complete everything with true or false values, you will see below how you should prepare before leaving the house. One of the given variables has no logical value.

Tip: Remember to put only text (strings) in quotes. We leave logical values without such signs.

Excersise 5

The next type of variables are arrays. In a simplified way, we can say that these are sets of other variables (string, number, boolean, etc.). They are created in the same way as other variables, except that after the equality sign we write a square bracket in which we insert values separated by a comma. The variables in the array can be accessed by specifying the name of the array and the index number in which the particular value is. Remember that arrays are numbered according to the American standard, that is from zero and not from one.

This is an example of an array:

var array = ["pineapple", 5, "mirabelle"];
//The index 0 contains the string "pineapple", index 1 – number 5, and index 2 – "mirabelle".

Check the link below:

Run exercise #5

Find the array. Fill it in accordance with the following requirements:

This is not all that you can learn about arrays. You will learn more advanced topics later.

Next chapter: Operators »