Ultimate JavaScript Guide or Introduction to Modern JavaScript
Published: 2022-02-14 08:18:27

On this article will discuss the following topics on JavaScript;
1.	What is JavaScript?
2.	A Simple JavaScript Syntax
3.	Variables in JavaScript
4.	Data types in JavaScript
5.	Array methods in JavaScript
6.	Loops in JavaScript
7.	Conditional statements


**Introduction into JavaScript**
JavaScript is an open source and commonly known as a client-side scripting language, which is dynamic and is used to enhance the interaction of webpages. To run JavaScript You can use the web console of your preferred browser like Chrome (ctrl+shift+I on windows and ctrl+shift+k on mac ) or you can use code editors like Visual Studio code, Atom or sublime text.


**Simple JavaScript Syntax**
// This is my first code (This indicates a comment that gives more information about the code but is not executed)
/*Welcome to my first code
Happy coding*/ (This is used in cases where we have multiple lines of comments)

**_Example of a simple JavaScript syntax;_**


![Syntax](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gzzmvm03qr060omxgv16.PNG)
                                      
**Variables in JavaScript**
All JavaScript variables must be identified with unique names referred to as identifiers

**_How to declare variables in JavaScript_**
As shown below num, are variables, declared with the var keyword

a)	**Var**

![Var](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m17o5z2ryb34kdwe0n66.PNG)


b)	**Strings**
In cases where we have, we dealing with a string value, we also declare a variable, initializing it with a string value, and then returning the value. Point to note where dealing with a string you need to surround the value with quote


![String](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/79hyafvxa5wpc3cse5c9.PNG)

c)	**Let**
As shown below a, b and c are variables, declared with the let keyword

![Let](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lg23i7oq1g2ak5vcq5d7.PNG)

d)	**Const**
This defines a constant reference to a value. You cannot reassign a value, array or an object

![Const](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x77tnzf65xqr1dxa1kyf.PNG)

       
            **Data types in JavaScript**
We have 7 data types in JavaScript namely; string, number,  bigint, Boolean, null, undefined, and symbol. We will have a discussion on what each of them represents

i.	**String**
A string (or a text string) is a series of characters like “Ann”. When using a string it’s supposed to be quoted with either a single quote or a double quote

![String](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qegk36febbw65u7272pk.PNG)


ii.	**Number**
JavaScript has only one type of numbers such as 1,2,3,4. In number values we can use the ones with a decimal point or not as both are allowed

![Number](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j00zkz8lsdh4y044zx3u.PNG)

iii.	**Bigint**
For a bigint, this is similar to the number data type but it holds bigger values. For this you add the letter n, next to you value to indicate that it’s an integer,

![Bigint](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s6cv7dy7iyc5d0auk3os.PNG)

iv.	**Boolean**
Booleans can only have two values; True or False

![Boolean](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6muqf2bzy6l1jijpjj34.PNG)

                  **Array methods in JavaScript**
An array object is used to store multiple values in a single variable

![Array](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h0dg1kyu3mi0lp77186c.PNG)

   **_JavaScript Arrays are divided into two_**
_One-dimensional arrays_- This is a linear array which consists of only one row or column
_Multi-dimensional arrays_- This is an array with two or more columns
	

                 **Loops in JavaScript**
In cases where you would want to run the same code multiple times, each time with a different value
_**FOR**_ - loops through the code specified for a number of times

![For_loop](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vccgg3l936fm3cg72um0.PNG)

_**WHILE**_ - loops through a block of code for as long as the specified condition is true

![While_Loop](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/teu5dmqtoov3mh98znyt.PNG)

**_DO WHILE_** – This condition loops for as long as the specified condition is true
![Do_While_Loop](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/s1os2rsjuxo32eavvque.PNG)

              **Conditional statements**
We have four types of conditional statements in JavaScript

**IF**- This is when we have a block of code is executed, if the set condition is true
		  **_Syntax_**

if (condition) {
  // code to be executed if the condition is true
}


**ELSE**- This is else to specify a block of code to be executed, if the same condition is false
			**_Syntax_**
if (condition) {
  //code to be executed if the condition is true
} else {
  //code to be executed if the condition is false
}

			
**ELSE IF**- This is used else if to specify a new condition to test, if the first condition is false
                  **_Syntax_**
if (condition1) {
  //code to be executed if condition1 is true
} else if (condition2) {
  //code to be executed if the condition1 is false and condition2 is true
} else {
  //code to be executed if the condition1 is false and condition2 is false
}

**SWITCH**- We use switch to select one of many blocks of code to be executed
 		**_Syntax_**
switch(expression) {
  case n:
    //answer block of code
    break;
  case n:
    //answer block of code
    break;
  default:
    default //answer block of code
}