Let’s Explore JavaScript | History , Overview and Basic Concepts

 

Photo by Jexo on Unsplash

JavaScript shortly known as JS is a scripting language mainly used for web programming, especially for client sites. But now it is used in several fields like server-side, Android, iOS and desktop application development and many more. In this tutorial, we will learn about the history, overview, and basic concepts of JavaScript. I will publish a detailed article in every part of this article. So stay with me hope we can learn so many things together. Let’s get started!

Let’s learn about the history of JavaScript :

In the 90th century, the Netscape Navigator was the most popular web browser. In 1995 the management of Netscape decided to create a new programming language. Brendan Eich was working on this. In September 1995 they have a new language named LiveScript. And in December they released the stable version of JavaScript. After that JavaScript has passed a lot of time. And now it is one of the most popular languages for web programming.

Overview :

JavaScript is mainly a scripting language. It is a multi-paradigm, single-threaded language. It has all the necessary features. It’s improving day by day. In 2015 it has a great change. We all know that as ES6 or ECMA script 6. Maximum programmers use that version of JavaScript. I also love the features of ES6. The last stable release for JavaScript is ECMAScript 2020.

Let’s have a look on some basic concepts of JavaScript:

Every programming language has some basic concepts and they are the most important thing for learners to make their journey smoother. These basic things are :

1. Variable
2. Conditional Statement
3. Array , list or collection
4. Loop
5. Function

Let’s learn them! 😀

1. Variable :

Variables are used to store data. Every programming language has variables. In JavaScript, we declare a variable with the var keyword. Let’s look at the example below :

var a = 6; var b = 3;

Here a is a variable which has a value 5. We can change the value at any time. Like this :

var a = 5;

a = 7;

var has a global scope. In 2015 a new version of JavaScript was released name ECMAScript 6. In this version, they introduce the let and const  keyword. we can also declare a variable with let and const. See the example below.

let x =81;
const y = 54;

Although this keyword has some difference you can use any of this to declare your variable.

i. Difference between var , let and const.

In JavaScript, we can declare a variable with 3 keywords. They are var, let, and const. Now the question is why these 3 keywords? We can declare a variable with 1 keyword. Let’s see what is the difference between these three keywords.
1. var declaration is global scoped or function scoped. On the other hand let and const are block-scoped
2. var variables can be re-declared or can be updated, let variables can be updated but can’t be re-declared and the last one const neither be updated nor re-declared.
Now we know how to declare a variable. How will we show that variable? Let’s see how to show output in JavaScript

ii. JavaScript Output

In JS we can show output in 4 different ways. They are :
1. Through innerHTML;

var element = document.getElementbyId('demo');
element.innerHTML = “something”;

2. Write method ;

document.write(“something”);

3. Though alert;

window.alert(‘something’);

4. Through console;

 console.log(‘something’)

Now we know how to declare a variable and show them. Let’s jump into another basic concept of javascript.

2. Conditional Statement :

Conditional statement is very important in a programming language. It means they do something based on a condition. For example, you want to buy a mobile phone. Now if you have more than $100 then you will buy a smartphone otherwise you will buy a feature ( button ) phone. Let’s see it in a code example:

var money = 140;
if(money > 100){buySmartPhone() //this part will execute}
else{buyButtonPhone()}

We can write multiple layers of condition. For example, if you have less than $20 you will buy a piece of bread or if you have more than $20 but less than $30 you will buy a little 2 layer burger or if you have more than $30 you will buy a big 3 layer burger. Let’s see it in code :

var money = $25;
if(money < 20){buyBread()}
else if(money > 20 && money < 30){buyLittleBurger()}
else if(money > 30){buyBigBurger()}

Writing these multiple layers of conditions is tiring, isn’t it? For this, we have switch statement. We will discuss this in another article. By the way && is a conditional operator it means both conditions have to be true to execute the code in curly brackets.

3. Array :

The array is a very important concept in every programming language. An array can store multiple values where a variable can store a single data. In array, you can access the values separately. Let’s see an example :

var laptop = [“HP”, “Dell”, “Asus”]
document.write(laptop[0]); //print HP

If you want to store these 3 strings in normal variables you need 3 variables. But only one array can store these 3 or even more. Basically, it is used for storing a collection of data.

4. Loop :

Loop is also an important concept for programming language. Loop means do the same work multiple times. In javascipt, mainly we have 3 types of loop

1. for loop
2. while loop
3. do while loop

Let’s see the syntax for the loops

//For loop
for(var i = 0;  i ≤ 10; i++){
    document.write('I am a programmer');
}
//while loop
var i = 1;
while(i <= 10){
    document.write('I am a programmer'); 
    i++;
}
//do while loop
do{
document.write('I am a programmer');
i++;
}
while(i <= 10)

5. Function :

You can imagine a function like a machine. For example the coffee maker. You put the necessary thing in the machine and you get the output as coffee. In the function you put the necessary things (parameter) and you get the output. Let’s have an example :

function square(num){
    return num*n;
}
square(2); // 4

This is how a function works and what it’s syntax look like. A function is also used to remove duplicate code. You put your necessary code in a function, you can use that throughout the program.

That’s all about today. I will provide more articles on javascript. If I have done any mistakes in this article please let me know so that we can learn the correct thing together.

Happy Coding ❤;

Facebook : https://www.facebook.com/programmingcareofficial

YouTube: https://www.youtube.com/programmingcare