Javascript 101: Introduction To Modern Javacript
Published: 2022-02-14 20:43:55

Javascript is client side scripting language in web development to make websites more interactive to their users. It is an interpreted language unlike other progamming languages.

**A Brief Javascript History**

JavaScript was created at Netscape Communications by Brendan Eich in 1995.Initially known as LiveScript, Netscape changed the name to JavaScript so they could position it as a companion for the Java language.
JavaScript is in no way related to the Java programming language. .

**Requirements to get you started**
1. A computer
2. A web browser
3. A text editor of your choice(I prefer using VSCode[](https://code.visualstudio.com/download)).
4. Good internet.
5. Motive.

##Javascript syntax
The syntax of JavaScript is the set of rules that define a correctly structured JavaScript program.

```
<script ...>
   JavaScript code
</script>

```
The script tag takes two important attributes:

1. **language** - specifies what scripting language you are using.
2. **type** -  indicate the scripting language in use and its value should be set to "text/javascript".

```
<script language = "javascript" type = "text/javascript">
   JavaScript code
</script>
```
 ** Your first javascript code**

```
<html>
   <body>   
      <script language = "javascript" type = "text/javascript">
         <!--
            document.write("Hello World!")
         //-->
      </script>      
   </body>
</html>
```
Javascript is a free format language , that is , it  ignores space, tabs and line breaks.

semicolons in Javascript are optional. It is though a good practice to use them in your code.

```
<script language = "javascript" type = "text/javascript">
   <!--
//codes lines without semicolons
      var1 = 10
      var2 = 20
// codes lines with semicolons
      var3 = 15; var4 = 25;
   //-->
</script>
```

**Comments in JS**
Comments are crucial in any programming language.They make code more readable and leave remarks in our code.

Single line Comments

```
// This is the first comment
// This is the second comment
// I am a single line comment
```
 
Multiline comments

```
/* This is a multiline comment
Multiline comments can take multiple lines
JavaScript is the language of the web
*/
```
## Javascript Placement
There is a flexibility given to include JavaScript code anywhere in an HTML
document. However the most preferred ways to include JavaScript in an HTML
file are as follows:
- Script in <head>...</head> section.
- Script in <body>...</body> section.
- Script in <body>...</body> and <head>...</head> sections.
- Script in an external file and then include in <head>...</head> section.
The first three are written between the script tags.
 ```
<script language = "javascript" type = "text/javascript">
   JavaScript code
</script>
```
Script in an external file and then include in <head>...</head> section.

```
<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
.......
</body>
</html>
```
##Variables in Js
**Variable declaration**
We can declare variables using three methods.

```
var age = 20;
    // var values can change

let name = 'Joshua';
    // same as var
const gravity = 10;
   //used to declare constant values e.g gravity as in above 
```
 **NB** It is a good practice to use `let` rather than `var` in variable declarations as it is more secure method.
Variables are containers of data.. 
In JS variable there are diffrent kinds of data types:
1. **Numbers**
     integers(whole numbers)
`Var num1 = 10;`

    float-point number(numbers with fractions)
`var num2 = 15.69;`

2. **Strings**
  A collections of more than one characters between two single quotes, double quotes, or backticks.
`var sayHi = "Hello, World";`

3. **Booleans**
  A boolean value is either True or False while boolean data types are either true or false. They return a true  or false value.
`true // if the light is on, the value is true
false // if the light is off, the value is false` 

4. **Undefined**
  In JavaScript, if we don't assign a value to a variable, the value is undefined. In addition to that, if a function is not returning anything, it returns undefined.

```
<html>
<head>
<script>
var firstName;
document.write(firstName) // undefined, because it is not assigned to a value yet
</script>
</head>
<body>
.......
</body>
</html>
```
5. **Null** 
Null in JavaScript means an empty value.
`var emptyValue = null;`

**Variable naming rules**
 In Javascript we have rules that are used when naming variables. Most of the rules apply in other programming languages.
A valid JavaScript variable name must follow the following rules:
  - A JavaScript variable name should not begin with a number.
  - A JavaScript variable name does not allow special characters except dollar sign and underscore.
  - A JavaScript variable name follows a camelCase convention.
  - A JavaScript variable name should not have space between words.

The following are examples of valid JavaScript variables.

```
firstName
lastName
country
city
capitalCity
age
isMarried

first_name
last_name
is_married
capital_city

num1
num_1
_num_1
$num1
year2020
year_2020
```
Example of invalid Variable names

```
  first-name
  1_num
  num_#_1
```

**Conclusion**
Javascript is an awesome scripting language that can be used in almost all fields in technology especially in web development.It is easy to learn and user-friendly. Happy coding!
Please drop a comment if you liked this blog or if there is anything you need clarification about. Thank you.