🧠 Fundamentals of JavaScript (JS)

Let's first clear our minds that we don't know anything about JS 🤪. And let's proceed one by one in-depth about the basics and fundamentals of JavaScript.

Before starting anything on JavaScript, many of us have a question in our 🧠, Are JavaScript and Java are same? The answer is NO. They are not the same. Both are different and I will cover this topic in a future article of mine. So, if anyone asks if you are the same or not you know what you need to tell. Alright!!!. A Big No.

Reason: Java is an OOP programming language, and it helps to create applications that function in a virtual machine or browser, while JavaScript is an OOP scripting language.

Power of JavaScript

Over the last few years, we have seen that using JS we can develop a Webpage on desktop or mobile, mobile applications, games, and Machine learning programs and also recently we have seen that we can develop applications in Blockchain. So we can see how much JS is powerful and it's everywhere, we can't avoid it. If you know JS very well you can survive in IT industry easily.

I hope we are at least clear on why JS is important in 2022 and why it is in demand.

History of JavaScript

Let us first learn a little about JavaScript History. It will help you to build confidence in you that you know a little more about JavaScript.

In September 1995, a Netscape programmer named Brandan Eich developed a new scripting language in just 10 days. It was originally named Mocha, but quickly became known as LiveScript in 1996 and, later, JavaScript to till Date. Mocha is a coffee name. that's why you see the above image with coffee.

What is ECMAScript? Why this came into the picture?

When Netscape introduced LiveScript they have their own scripting language to build webpages in Netscape 2.0 in the 1995 browser. Later Internet Explorer (IE) also introduced its own scripting language. So, developers have to write the same functionalities into two different scripting languages to work on both Netscape 2.0 and IE. To avoid this confusion and for that shake of developers community ECMA comes into the picture and standardizes the scripting language avoid this confusion. ECMA is an organization that creates standards for technologies internationally.

Full Form

ECMA - European Computer Manufacturer's Association

Let's now dive into the basics of JS

Basics of JS

To start with any programming language we must first learn about six basics things

1. Values

2. Operations

3. Variables

4. Decisions

5. Loops

6. Functions

Discussing everything in detail in one blog is not good for the new learner as it will create confusion among them. But for sure all the topics will be covered in a future article. But I will just try to provide a glance at each point discussed above.

1. Values

In JS, values consist of strings, number, boolean, null, undefined and many more. This is the most basic and first fundamental concept of JavaScript or any other language. Values are almost the same for other programming languages as well.

Few Examples are

let a = 6; // 6 is a value and it's a number
let b = 5.66666; // 5.66666 is a value and it's a number in JS as well
let name = 'John'; // John is a value and it's a string
let firstInitial = 'J'  // J is a value and it's a string
let user  = true; // true is a value and it's a Boolean
let value = null; // null means empty value
let firstName = undefined; // it is also empty value or not defined value

Note:

5, 5.6, -5.6, 28e.15 are treated as number.

Anything inside a single quote '', double quote "" and string literals call backticks `` are treated as a string.

null is treated as the empty value in JS.

undefined also we can tell it's empty but yes null and undefined are not the same. we will discuss this in a future blog

2. Operations

To perform some logical expressions like addition, subtraction, multiplication, division, etc. we use operators like +,-,*,/ and so on. To execute the expression we combine operators and operands (operands are variable) to perform some logical result called operations.

let a = 5; // declaring variable a
let b = 2; // declaring variable b

let sum  = a + b; //7, addition operation
let sub = a - b; //3, subtraction operation
let mul = a * b; //10, multiplication operation
// and so on ..............

Operators are a big topic and will be covered separately in detail. But let me introduce to you what all operators are available in JS.

Assignment operators
Comparison operators
Arithmetic operators
Bitwise operators
Logical operators
BigInt operators
String operators
Conditional (ternary) operator
Comma operator
Unary operators
Relational operators

3. Variables

Variables are containers in JS that store any data in it. It can store any form of data like Number, String, Array, Object, etc.

let firstname = "John"
let lastname = "Smith"

From the above example, we see that John is stored in firstname and Smith is stored in lastname. So, firstname and lastname are two different containers or variables which is holding some values in them.

4. Loops

If we want to iterate the same code again and again for some time as per to condition, we use loops.

Let me introduce some of the loops in JS.

for statement
do...while statement
while statement
break statement
continue statement
for...in statement
for...of statement

To understand it better let's take one scenario to display your name 5 times again and again. We will use the most basic loop called the for loop.

Incode

for(let i=0; i<5; i++){
console. log(`Abhishek`)
}

Output

Abhishek
Abhishek
Abhishek
Abhishek
Abhishek

As we can see it's so easy to iterate the same code again and again with less code and we can reduce so much pain for developers by using loops. It's readable and modular too.

In simple words, I have initialized one variable called i=0 and asked if i<5 then print my name in the output. After printing my name once, I have to increase the count of i by one. In shorthand, we can write i++ i.e, i=i+1. This is how the value of i is getting increased by 1 every time and as soon as the value of i becomes 5 condition got failed control came out of the loop and the program stopped.

I will discuss the other type of loop in detail when I will have a dedicated blog for it.

5. Functions

JS function is used to perform the same task or code again and again when it called or invoked.

Example

function myFunction(parameter1, parameter2) {
  return parameter1* parameter2;   // The function returns the product of parameter1 and parameter2
}

myFunction(2,3) // myFunction is called.

From the above code we can see, to declare a variable we need to first start with the keyword function followed by the function name i.e, myFunction. Here, parameter1 and paramenter2 are parameters provided in the function. {} this is the scope of the function or we can say the task needed to perform will be written inside this scope or curly braces.