Basic Concepts in JavaScript🤠

9 min readFeb 23, 2021

by Vihan Pamudya / February 23, 2021

Hello everyone!!! This is my first article. Here I’m going to write about basic concepts in JavaScript.

JavaScript Introduction

JavaScript is a cross-platform, object-oriented scripting language used to render interactive and mobile applications for webpages. Its implementation allows client-side scripts to interact with users and create dynamic pages. It is currently the most popular and widely used language in the world.

Client-side JavaScript is the most common form of the language. The script should be included in or referenced by the HTML document so that the browser can interpret the code. This means that web pages do not have to be static HTML, but can include programs that interact with users, control the browser, and dynamically create HTML content. Compared with traditional CGI server-side scripts, the JavaScript client-side mechanism has many advantages. For example, you might use JavaScript to check whether the user has entered a valid email address in a form field.

I hope you can correctly understand basic concepts in javascript after reading this post. As you read this article, you will find some unusual terms such as arrays, conditional statements, loops, operators, etc.

JavaScript Comments

It is possible to use JavaScript comments to describe JavaScript code and to make it more readable. When checking alternative code, JavaScript comments can also be used to prevent the execution.

· Single-Line Comments

Single line comments start with //. JavaScript can ignore any text between the end of the line and //.

The above example uses single-line comments at the end of each line to explain the code.

· Multi-line Comments

Multi-line comments start with /* and end with */. JavaScript can ignore any text between /* and */.

The above example uses a multi-line comment to explain the code.

JavaScript Variables

JavaScript variables are containers for storing data values. An important part of any programming language is the declaring variable. There are three types that can be used in JavaScript to declare variables.

var
let
const

Until 2015, the only way to declare a JavaScript variable was to use the keyword var. The 2015 version of JavaScript (ES6) allows the use of const and let keywords. We can use the above keywords to define any Boolean value, string, symbol, number, and object. We may use the keyword var to describe our global variables. In JavaScript, the Global mean can use variables anywhere. The let keyword, only we can use in the declaration scope (restricted scope). The const keyword is used to declare const values (variables that cannot be reassigned) in our JavaScript code.

In the above example, I showed you how to declare and initialize the value of a variable.

JavaScript Operators

When we talk about operators, there are five types of operators.

· Assignment operator
· Arithmetic Operators
· Comparison Operators
· Logical Operators
· Bitwise Operators

Assignment Operators: Assignment operators assign values to JavaScript variables.

Arithmetic Operators: Arithmetic operators are used to performing arithmetic on numbers.

Comparison Operators: To evaluate the equality or difference between variables or values, comparison operators are used in logical statements.

Logical Operators: Logical operators are used to determining the logic between variables or values.

Bitwise Operators: Any numerical operand is converted into a 32-bit number in the operation. The output is converted back to a number in JavaScript.

JavaScript Functions

A JavaScript function is a code block designed to accomplish a particular task. Functions help us to build JavaScript reusable code. Our code structure would be difficult if we want to use any aspect of our code again and again. Therefore, we can use the function to resolve that problem.

· JavaScript Function Syntax

JavaScript functions are defined by the function keyword, followed by the name, and then parentheses (). Function names can contain letters, digits, underscores, and dollar signs.

The brackets can contain parameter names separated by commas:

(Parameter 1, parameter 2,….)

The code to be executed by this function is placed in curly braces: { }

This code contains all of the above. We may call our function by the name helloCall at line 7 in the above code. At any time, we can use that function anywhere in our code.

· Passing a variable to a function

Function parameters are listed inside the parentheses () in the function definition. Function arguments are the values that the function receives when invoked.

If we need to pass a variable to our function, in line 9 we called our function name passValue and pass the value of 10. Then “x” is equal to 10 and it will show in the browser.

· Function Return

If a function from a statement is invoked, JavaScript return to execute the code after the statement is invoked. Functions often compute a return value. The return value is “returned” back to the “caller”.

In a browser console, it will show the answer is 15. We can use this function to adding two numbers.

JavaScript Arrays

An array is a special variable, which can store multiple values in a single variable at a time. We can store multiple types of data in one place without wasting time to declare one by one.

If there is a list of items, storing the fruit in a single variable might look like this,

What if you want to loop through the fruits and discover a particular one, though? And what if you did not have three fruits, but 300 fruits?

The solution is an array!

An array can hold several values under a single name, and by referring to an index number, you can access the values.

In the array’s elements are named by 0, 1… order. In the above example, “Apple” is the 0 element that can be displayed in the browser using “document.write (array[0]);”.

· Nested Array

We may also use an array called nested arrays or multi-dimensional arrays with another array.

It is called [0][0],[0][1].. in a nested array, Just like that. The element [0][0] in the above example is “Vihan” and can be viewed in the browser using “document.write (array2 [0][0]);”.

JavaScript Conditionals and loops

· Conditional Statements

Based on different circumstances, conditional statements are used to execute various actions. When we talk about conditional statements, there are four types of conditional statements.

· If Statement
· Else Statement
· Else if Statement
· Switch Statement

If Statement: To specify a block of JavaScript code to be executed if a condition is true, we use the if statement.

Else Statement: To specify a block of JavaScript code to be executed if a condition is false, we use the “else” statement.

Else if Statement: If the first condition is false, we use the else-if statement to define a new condition.

Switch Statement: To select one of the several code blocks to be executed, we use the switch statement.

· Loops

If you want to run the same code over and over again, each time with a different value, we have to call the statement again and again. But when we use loops we can execute a block of code many times easily.

There are three loops,

· for loop
· while loop
· do-while loop

Let’s discuss one by one;

For loop:

for(initialization; condition; iteration){
//statement
}

Let us look at an example to understand;
I want to display numbers 1 to 10:

From the example above, you can see:

First, declare a variable called i. Then, we assign the value i = 1 and then check the condition (i <=10). If the condition is true, then go and execute the statements within the loop. The iteration part (i++) comes after that. And now i=2. Then you check the condition again and do the same thing. Then exit from the loop part if the condition becomes false.

While loop: The while loop loops as long as a specified condition is true through a block of code.

while(condition){
//statement
}

Let us try an example written in a for loop using a while loop;

do-while loop: A variant of the while loop is the do/while loop. Before testing if the condition is true, this loop will run the code block once, then it will repeat the loop as long as the condition is true.

do{
//statement
} while(condition);

Let us look at the same example;

We can get the same output;

JavaScript Break and Continue

· Break Statement: To move out of a loop, we use the break statement.

In the above example, when the loop counter (i) is 3, the break statement ends the loop.

· Continue Statement: If a specified condition occurs, the continue statement breaks one iteration and continues with the next iteration in the loop.